dotUI

Complete system — refine anything below.

Simple

Advanced

Brand & base

Brand

Baseauto

Successauto

Warningauto

Dangerauto

Infoauto

Pick one brand colour — the rest of the system derives from it.

Style

Contrast — text on solid surface

Aaneutral5.9:1AA

Aaaccent6.5:1AA

Aasuccess7.0:1AAA

Aawarning6.4:1AA

Aadanger5.8:1AA

Aainfo6.3:1AA

Expose palettes as foundationsSurface every generated ramp as an editable foundation.

Components

Color Swatches

Containers

Disclosure

Feedback

Inputs

Menus Lists

Overlays

Progress

Selection Controls

Sliders