plinth_core 1.2.0
plinth_core: ^1.2.0 copied to clipboard
Design tokens for Plinth UI: seed a 10-shade colour ramp from any brand colour, name colours by role, resolve text against WCAG contrast floors.
plinth_core #
Design tokens and theme foundation for Plinth UI — colors, spacing, radius, and typography scales that every Plinth component reads from.
This package is the theme layer only. For the actual widgets
(buttons, inputs, cards, and 114 others), see
plinth_components.
Usage #
Register PlinthTheme once, at your app root:
MaterialApp(
theme: ThemeData(
useMaterial3: true,
extensions: [PlinthTheme.defaultTheme],
),
)
Every Plinth widget reads its colors, spacing, and radius from this
theme via context.plinth — a single palette swap restyles the whole
app. PlinthTheme generates a full 10-shade ramp from a single base
color per palette entry, using non-linear lightness stops and
shade-dependent saturation rather than plain linear interpolation, so
light shades read as soft tints and dark shades stay rich rather than
just fading to gray.
What's in this package #
PlinthTheme— theThemeExtension<PlinthTheme>holding color palettes, spacing, radius, and font-size scales.PlinthSize(xs–xl) andPlinthVariant(filled,light,outline,subtle,transparent,defaultVariant) — shared tokens used consistently across every Plinth component.context.plinth— convenience extension for accessing the active theme from anyBuildContext.
See the full documentation for the complete component reference and a live example app.