Contact Tiles

Contact tiles can be used in two ways: either to show the most important contact for the topic or to represent different contact persons for a department. They can be used with or without a picture.




Contact tile with picture

contact tile with portrait.jpg

Left: Each contact tile contains
a. Picture
b. Name
c. Job title and/or department
d. Contact number options (mobile, telephone and fax)
e. E-Mail address (opens e-mail application)

There are different background options:
Contact tile without background. The hover color of the e-mail link is set to dark grey.

Middle: Contact tile with pale color background. The hover color of the e-mail link is set to dark grey.

Right: Contact tile with colored background. The hover color of the e-mail link is set to light grey.


Contact tile without picture

contact tile without picture.jpg
This version is available in the same background options as the contact tile with picture.

It contains the same elements (except the picture):
a. Name
b. Job title and/or department
c. Contact number options (mobile, telephone and fax)
d. E-Mail address (opens e-mail application)



Contact tiles can be placed in S columns,
a. floating in column size S next to text on the left or right
b. next to each other, 3 tiles in a row in column size S. You can use as many rows as you need. If you want to highlight the most important contact person, you can use a full corporate color Tile for him/her and Pale Color Contact Tiles for the other ones.

Or you can place the Contact Tile next to teasers, images or other suitable components. The Tiles expand vertically with the inserted elements and text length. If there are two or more components in a row, the longest one defines the length of all components in the row.

responsive behaviour.jpg

Left: The contact tile behaves the same in all versions for the three largest viewports.

Right: Only the smallest viewport displays it on a 12 columns width.

Related topics


Kontakt und Feedback

Das Team Brand Consultancy berät Sie gerne bei Fragen: Kontakt.
Wir freuen uns über ein Feedback zum Brand Portal.