UI Kit

URALIC Keskuse disainisüsteem — värvid, tüpograafia, ikoonid ja komponendid

Värvid

Brand Forest
#2D5A3F
Tume metsaroheline
Forest Dark
#1E3F2C
Sügav metsaroheline
Brand Green
#BAE3B7
Peamine roheline
Green Dark
#4A9B5E
Tume roheline
Green Medium
#9DD4A5
Keskmine roheline
Green Tint
#f0faf0
Hele roheline taust
Text Dark
#1d2327
Peamine tekst
Text Muted
#666666
Sekundaarne tekst
BG Light
#fafafa
Hele taust
White
#ffffff
Valge

Tüpograafia

Font: Inter (Google Fonts)

H1 — Pealkiri (3.5rem / 56px)

H2 — Alampealkiri (2.5rem / 40px)

H3 — Sektsiooni pealkiri (1.5rem / 24px)

H4 — Kaardi pealkiri (1.2rem / 19px)

Body Large — Suurem tekst kirjelduste jaoks (1.3rem)

Body Regular — Tavaline tekst sisu jaoks (1rem / 16px)

Small — Väike tekst, metaandmed (0.875rem / 14px)

Nupud

Badge
PILL BADGE
Link koos noolega

Gradiendid

Brown Gradient — Missioon / CTA
Green Gradient — Väärtused
Dark Green Gradient

Ikoonid

Lucide Icons — lucide.dev/icons

Kliki ikoonil, et kopeerida nimi lõikelauale. Kasuta neid Customizeris või projekti väljadel.

Kaardid

Glass kaart

Poolläbipaistev kaart gradient sektsioonide jaoks

Shadow kaart

Valge kaart varjuga väärtuste jaoks

Image kaart

Pildiga kaart fookuse jaoks

Vahed ja ümardused

Border Radius

4px
8px
12px
50%
50px pill

Shadows

Light
Medium
Heavy