Design system
Timeline Item
Last updated 4 April 2025
The Insites Timeline component is used to create a container for Events sorted based on date and time. Insites allows you to add buttons, links and even icons on your timeline, making it easily your own.
Requirements
To use these components in Figma, install the latest Insites font icons.
- Download the Insites icon font.
- Install the font file on your computer.
- Restart Figma so the font shows in your font list.
To change an icon, copy it from the font icons list and paste it into the icon layer of the component.
Figma Component Variant Properties
Timeline Item
| Properties | Options | Notes |
|---|---|---|
| Inline | True, False | Use an icon for the bullet of the component |
| Item Content | - | Use background color or stroke for the bullet of the component |
| Show Date Time | True, False | Add date and time for the content of the component |
| Item Action | - | Display the button inline with the content of the component |
| Bullet Icon | True, False | |
| Bullet Solid | True, False |