Hopp til innhold

Spacing

Luft i og mellom komponentene er en viktig ingrediens i det visuelle designet

Bruk av spacing

Spacing er viktig for å gi luft i og mellom komponentene.

Vi bruker variabler basert på 8pt grid for å definere spacing. På denne måten sikrer vi en forutsigbar skalering fremfor å overlate det til tilfeldighetene.

Variabler

Disse Less-variablene kan brukes til å definere margin og padding i og rundt komponenter og innhold.

VariabelVerdiEksempel
Base value8px
@ffe-spacing-xs8px
@ffe-spacing-sm16px
@ffe-spacing-md24px
@ffe-spacing-lg32px
@ffe-spacing-xl40px
@ffe-spacing-2xl48px
@ffe-spacing-3xl64px
@ffe-spacing-4xl80px
@ffe-spacing-5xl160px