06 — Rom og layout
Rom og layout
Alt rom er multipler av 4 px. Forutsigbar rytme gjør at brukere finner samme informasjon på samme sted, hver gang — og at tettheten aldri føles tilfeldig.
Skala
Romskala (4 px-basis)
space-14px
Ikon til etikett
space-28px
Innhold i badges, tette lister
space-312px
Mellom relaterte felter
space-416px
Standard mellomrom i kort
space-520px
Kortpadding
space-624px
Panelpadding, kolonnemellomrom
space-832px
Mellom kortgrupper
space-1248px
Mellom underseksjoner
space-1664px
Mellom hovedseksjoner
Struktur
Containere og rytme
Containerbredder
- Applikasjonsrammemaks 1400px · 20–32px sidepadding
- Lesekolonnemaks 720px for brødtekst
- Innholdsområdemaks 896px i dokumentasjon
- Sidemeny256px fast, kollapser under 1024px
Seksjonsrytme
64px mellom hovedseksjoner, 24px inni.
Seksjon A
↕ 64px
Seksjon B
Kortanatomi
20px padding, 16px mellom blokker, 12–16px radius.
Anlegg
Transformatorstasjon Nord
Perimeterhendelse registrert. Ingen driftspåvirkning.
6 kilder41 min siden
Form
Radius og flatehøyde
rounded-md
6px — badges, prikker, små flater
rounded-lg
10px — knapper, felt, lister
rounded-xl
14px — kort og paneler
Skygger brukes kun for å skille et hevet lag fra bakgrunnen — aldri for effekt. Kanter gjør jobben i de fleste tilfeller.