AureliusOS — Design System Preview

Brand

2 lockups · wordmark · monogram · app icon, avatar, favicon

Logosbrand-logos.html

Decorative marksbrand-marks.html

Monogram & app iconbrand-monogram.html

Section-break treatmentbrand-section-break.html

Colors

5 swatch sets

Primarycolors-primary.html

Ink shadescolors-ink-shades.html

Tintscolors-tints.html

Semanticcolors-semantic.html

Neutralscolors-neutrals.html

Type

5 specimens

H1 / displaytype-h1.html

H2 / H3type-h2-h3.html

Body — lead, body, footertype-body.html

Eyebrowtype-eyebrow.htmlNot for slides

Slide typographytype-slide.html

Gradients

3 forms

Primary lineargradient-linear.html

Variants — diagonal, vertical, radial, extendedgradient-variants.html

Text gradientgradient-text.html

Spacing & shadow

3 scales

Spacing scalespacing-scale.html

Radiispacing-radii.html

Shadow scalespacing-shadows.html

Motion

3 curves · 4 durations

Curves & durationsmotion-curves.htmlRespects reduced motion

Icons

500 glyphs · 12 groups · 3 tones

Systemicons-system.html

Seticons-set.html

Usageicons-usage.htmlMono in dense UI

Catalogue — all 500, filterableicons-catalogue.html

Components

10 kits

Site headercomponent-header.html

Buttonscomponent-buttons.html

Inputscomponent-inputs.html

Pillscomponent-pills.html

Numbered badgescomponent-badges.html

Cardscomponent-cards.html

Gradient hero cardcomponent-gradient-card.html

Metric calloutscomponent-metrics.html

Pull quotecomponent-quote.html

Data tablecomponent-table.html

Atoms & marketing kit

5 atoms · 9 sections · one bundle

Atoms — GradientText, Pill, StatBig, Callout, Icon../ui_kits/atoms/atoms.htmlNeeds the bundle

Metrics — page, compact, slide../ui_kits/marketing_site/Metrics.htmlNeeds the bundle

Marketing site — composed home page../ui_kits/marketing_site/index.htmlNeeds the bundle

Slides

1280 × 720 · 12 layouts

Slide layouts — composition menuslide-layouts.html

Brand voice

The domain partner · full spec in BRAND_VOICE.md

Brand voicebrand-voice.html