The icon element let you display information in a visual and easy-to-grasp way. In the list of editorial elements you can find it as 'icons'. We built it in a light way that helps your site speed. You can add as many icons as you want. On desktop in a 100 row four icons will be in one row, on mobile up to two icons will be shown in each row.
- Icon image - we currently support svg files for that. They have a couple of advantages: First, they are very lightweight (usually around 1kb). Second, since svgs are vectors, they will be displayed in a sharp way on all resolutions. Third, we can control their appearance (e.g. make them white on colored background). If you want to convert existing png images to svgs, you can find a couple of free converters online, e.g. here. However, we recommend you to use original svgs, e.g. from FontAwesome.
- Color: The color of the icon. On colored background, all icons will be white. If you use more than one icon in the element, we strongly recommend you to use the same color for all icons in the element.
- Headline: We recommend less than 30 characters
- Subline: We recommend less than 50 characters.