Iconography
Our icons are visual symbols used to represent ideas, objects, or actions. They can communicate messages at a glance, afford interactivity, and draw attention to important information. They draw from details found in our typefaces and work well at small sizes.
256pt design grid
We use a 256pt design grid for all icon design. This includes the 8-point base unit and is used as the foundation to determine line thickness, proportion, shape and positioning across the entire set of icons. The grid helps guide design decisions, which will ensure a unified approach but more importantly allows flexibility in creating the appropriate shape needed to communicate the right idea.
Download template
Four principle shapes
The four design principle shapes help create guidance, consistency for icon idealization.
192pt x 192pt
224pt x 160pt
224pt x 224pt
160pt x 224pt
8pt shapes with story telling icons
Shape width versus scaling
When deciding the starting width of icon shape, make sure to include scaling limitation in design consideration.
16pt shapes for navigational icons
Icons for navigation, not applicable for large size.
128pt
64pt
32pt
16pt
8pt
Icons for story-telling, not applicable for small size.
128pt
64pt
32pt
16pt
8pt
Best practice
Below are some good guidance when designing icons using the 256pt system.
Adhere to base unit grid
Don’t stray from grid lines
Respect the padding zone
Don’t cross the line
Keep lines sharp in raster format
Avoid half-pixel render
Conform to logical proportions
Don’t make shit up
Styling
Coming soon. This section we could talk about the design look and feel of Mercedes icons in different venues.