Foundations

Colors

The Nexub color system is built on CSS custom properties. All colors adapt to light/dark mode and brand theme overrides automatically.

Brand Primary

The main product color. Responds to brand theme overrides via data-product.

primary-50

primary-100

primary-200

primary-300

primary-400

primary-500

primary-600

primary-700

primary-800

primary-900

primary-950

Semantic colors communicate state: success, error, warning, and info.

success-default

success-bg

error-default

error-bg

warning-default

warning-bg

info-default

info-bg

--color-bg-default

--color-bg-subtle

--color-bg-muted

--color-bg-raised

--color-bg-inverse

Primary text--color-text-primary

Secondary text--color-text-secondary

Muted text--color-text-muted

Subtle text--color-text-subtle

Disabled text--color-text-disabled

Link text--color-text-link

Each product brand has its own accent palette used when data-product is applied.

leap

bookub

payub

founderub