VIVLA · Design system 2026

VIVLA · Design system 2026 Go full screen

Blocks

Accordion

Accent Bare Custom Dark FaqsAll Long Split Stacked

CardGrid

Accent Edges FourColumns Grid Offset OffsetAccent OffsetPeople OffsetWrap Overlay OverlayAccent TwoColumns

Chapter

Figure Inset Photo Split SplitRent Wordmark

ContactPanel

Bare Default Long NoForm

EditorialFeatures

Accent Dark EatDrink Edge Empty Long Mirrored Places Shop Stay

EditorialText

Article ArticleRich ArticleTitled Empty Longform Minimal Split Stacked

FeatureList

Accent CoreValues Edges NoPhotos OnePhoto Panel WithBody

Gallery

AllBroken CatalogueSource Edges Mixed Pair ProdBaqueira ProdSingle ProdWealth Scale Single Stacked

Hero

Text TextAuthor TextLead TextLong TextMinimal

Media

Approach Flush FullWidth Interviews LongCopy Loop LoopNoPoster Minimal Naked Natural NoMedia

MediaCollage

Legacy Mosaic MosaicGaps MosaicLight MosaicLong MosaicMinimal MosaicSeven MosaicThree Orbital OrbitalVideo

NumberedList

Columns ColumnsThree Rows RowsBare Timeline

Prose

Article ArticleMinimal Cookies Empty Minimal Privacy Rich

SplitFeature

Alternating Cta

Statement

Columns ColumnsLong ColumnsMedia ColumnsSolo Cta CtaLong CtaNoLink CtaScript Portrait Text

StepPanel

Calendar CalendarSparse Collage CollageFive CollageShort Single SingleVideo Trio TrioLong Wide WideBare WidePickerPhoto

Testimonials

Foundations

Colors Themes Tokens

Type

Primitives

Accordion

Exclusive Faq OnDark Serif

Badge

Accent Circle Neutral Outline

BadgeMatrix

Accent Dark Invest Light

Button

Arrow AsLink Disabled Ghost Inverse Large Pill Primary Secondary Small

ButtonMatrix

Accent Dark Invest Light

Card

Alt Linked OnDark Outline Surface TextOnly

Dialog

Dark Large Medium

Eyebrow

Accent Muted NoPrefix OnDark

Heading

Display H1 H2 H3 Lead OnDark Sans Statement

Icon

IllustrationSize MediumSize OnDark UiSize

Layout

Accent Dark Invest Light Prose Tight Wide

Link

OnAccent OnDark OnLight

Marquee

Left PauseOnHover Right

Media

FocalPoint Landscape Portrait Square Wide

Script

Accent Muted OnAccent

Tabs

OnDark Pill Segmented Underline

Text

Accent Body Lead Measure Muted OnDark Small StatementSerif

TextField

OnAccent OnDark OnLight

Typography

SectionHeaderAccent SectionHeaderDark SectionHeaderInvest SectionHeaderLight

Video

Decorative Playable

Wordmark

OnAccent OnDark OnLight

1

Step 1: A step whose title runs long enough to break over two centred lines