We want to enable you to use the icons you need. Check the Porsche Design System for an
appropriate icon you are looking for. If there is no match, we encourage you to build, test and use the icons you need.
To help you meet the quality standards of Porsche, you will find the guidelines below.
Do you have an icon that is mandatory for several teams and purposes? We are happy to include it in the Porsche Design
System. Feel free to get in touch with us on our
Porsche Design System Slack
Check the Porsche environment for similar or close icons to adapt (Web, App, In Car, Print)Stick to the basic geometric shapes.Use easy and commonly known metaphors.Keep the details and complexity to a minimum.Make sure corresponding icons have the same position e.g. the "add" and "remove" icon.Check your design about other icons from the Porsche Design System.
Build your icons based on the default grid (48x48px) Default Porsche icons are based on 2px lines.Fill areas smaller than 4px.Snap pixels to the grid to ensure a sharp visual appearance (prevents blurred lines because of anti-aliasing on
low-resolution displays).Try to balance the width and height of the icon a uniform appearance in icon groups.Respect the safe area around the icon (approximately 4px, which can vary depending on the ratio of the icon).Design with only one color.
Transform vector forms in a full, coherent vector shape. (convert strokes to shapes and merge objects).Delete everything that is not necessary (layers, strokes, variants, etc.).Export your icon as an svg.Name svg according to the icons (e.g. "delete.svg" or "edit.svg").Name social icons "logo-companyname.svg".Run an svg optimizer to gain pure semantic code.
