Stile – Utility Reference

WIKI →

Tipografia

.h1 – Titolo principale

.h2 – Titolo sezione

.h3 – Sottotitolo

.h4 – Heading secondario

.h5 – Heading minore
.h6 – Heading piccolo
.h1-display – Titolo Display
.h1-news-title – H1 News
.h2-news-title – H2 News
.h3-news-title – H3 News

Paragrafo standard con testo linkato.

.text-paragraph – Dimensione testo di base

.text-byline – Byline / Meta

Titolo con utility → .typo-title .fw-title .text-h2 .lh-lg

Body con utility → .typo-body .fw-body .text-paragraph .lh-md

Byline con utility → .typo-byline .fw-byline .text-byline .lh-sm

Colori di Sfondo

.bg-surface
.bg-surface-fixed-light
.bg-surface-fixed-dark
.bg-accent-1
.bg-accent-1-hover
.bg-accent-2
.bg-accent-2-hover

Colori del Testo

.color-on-surface

.color-on-surface-fixed-light

.color-on-surface-fixed-dark

.color-on-accent-1

.color-on-accent-2

.color-text-link

Border Radius

.radius-base

Spacing Utility

Size Padding Classes Margin Classes
xsmaller .pt-xsmaller, .pb-xsmaller, .py-xsmaller, .px-xsmaller .mt-xsmaller, .mb-xsmaller, .my-xsmaller, .mx-xsmaller
smaller .pt-smaller, .pb-smaller, .py-smaller, .px-smaller .mt-smaller, .mb-smaller, .my-smaller, .mx-smaller
small .pt-small, .pb-small, .py-small, .px-small .mt-small, .mb-small, .my-small, .mx-small
regular .pt-regular, .pb-regular, .py-regular, .px-regular .mt-regular, .mb-regular, .my-regular, .mx-regular
large .pt-large, .pb-large, .py-large, .px-large .mt-large, .mb-large, .my-large, .mx-large
larger .pt-larger, .pb-larger, .py-larger, .px-larger .mt-larger, .mb-larger, .my-larger, .mx-larger

Griglia – Layout Utility

.grid-1-col

1

.grid-2-col

1
2

.grid-3-col

1
2
3

.grid-4-col

1
2
3
4

Pulsanti