Getting started in design

TDS is a work in progress. If you think something’s missing or isn't working, please let us know at disain@tallinnlv.ee

To access TDS design library, you will need to use Figma. To take full advantage of it, a paid plan is needed (Professional / Organization / Enterprise) but basic functionality is usable also in a free plan.

Install fonts

Make sure you have Lab Grotesque font installed. It can be purchased from the Letters from Sweden website. TDS uses regular and bold weights.

If for some reason you don’t have access to the Lab Grotesque font, it may be substituted with Arial for basic prototyping needs. Keep in mind that any final UI designs going to production must use Lab Grotesque font.

Get the Figma design library

Open the TDS master library and follow the instructions there.

Important note
At the moment you can access the TDS Figma library by manually downloading a copy and moving it into your Figma team. Keep in mind that if there are updates to the master library then you need to download a new copy to gain access to these updates.

Components and styles

Use only the colour and text styles provided by TDS and do not create new ones in Figma.

TDS is currently in early beta and provides a limited set of components. While it’s not recommended to detach and modify instances, it may be done if absolutely needed. Keep in mind that some components (Accordion for example) provide a content slot which you can swap with your own content, removing the need to detach the whole component.

If you think some important styles or component features are missing or something is broken, please let us know at disain@tallinnlv.ee