Tyylit
Välistys
Suomi.fi Design System sisältää valmiiksi määriteltyjä arvoja tilankäytölle. Näitä välistystokeneita käyttämällä verkkosivun asettelu pysyy yhtenäisenä ja harmonisena.
Seuraavia välistyksiä käytetään sivulla olevien elementtien välisen tilan luomiseen.
xxs5px
xs10px
s15px
m20px
l25px
xl30px
xxl40px
xxxl60px
xxxxl80px
Design Systemiin kuuluvaa lohkokomponenttia voidaan käyttää tilan luomiseen hyödyntämällä sen marginaali- ja täyteominaisuuksia (padding).
Lohko, jossa on eri määrä tilaa (padding) eri reunoilla
Lohko, jolla on yläpuolen marginaalia
Inset-välistykset
Inset-tokeneita käytetään komponenttien tai elementtien sisäisen välistyksen luomiseen.
insetXxs2px
insetXs4px
insetS6px
insetM8px
insetL10px
insetXl16px
insetXxl20px