Hoppa till huvudinnehållet

Block-varianter & layout

Simple Blocks

Demonstrerar alla block-typer, varianter och layoutalternativ.

1 (0.25rem)2 (0.5rem)4 (1rem — standard)8 (2rem)12 (4rem)16 (6rem)
solid (standard)
dashed
dotted
subtle
default (punktlista)
  • Första punkten
  • Andra punkten
  • Tredje punkten
minimal (ren, inga markeringar)
  • Första punkten
  • Andra punkten
  • Tredje punkten
ordered (numrerad)
  1. Steg ett
  2. Steg två
  3. Steg tre
ordered via layout variant
  1. Steg ett
  2. Steg två
  3. Steg tre
textSize: 1 (base), gap: 1 (tight)
  • Litet och tätt
  • Kompakt lista
  • Minimalt utrymme
textSize: 5 (3xl), gap: 5 (loose)
  • Stor och luftig
  • Generöst utrymme
  • Öppen layout
columns: 2, left-aligned
  • Kolumn ett
  • Kolumn två
  • Kolumn tre
  • Kolumn fyra
  • Kolumn fem
  • Kolumn sex
paragraph textSize: 1 → 5

textSize 1 (base)

textSize 2 (lg)

textSize 3 (xl)

textSize 4 (2xl)

textSize 5 (3xl)

paragraph align: left / center / right

Vänsterjusterad text

Centrerad text

Högerjusterad text

quote textSize: 2 (lg)

"Ett litet citat med textSize 2"

Demo
single (en bild)
Illustrationsbild
En ensam bild med bildtext
side-by-side (två bilder bredvid varandra)
Bild 1
Första bilden
Bild 2
Andra bilden
stacked (två bilder staplade)
Bild 1
Bild 2