The brand accent in src/project.config.ts is the single source of truth for your project's color identity. It exports theme style variables that the root layout applies, and every olwibaCN and olwibaUI component reads from the resulting CSS variables.
Change the accent once and the marketing pages, dashboard, admin area, and docs all follow.
src/styles/app.css follows a strict import order:
@import 'tailwindcss';
@import '@olwiba/cn/preset';
/* project brand token overrides below */Tailwind v4 provides the engine, the olwibaCN preset provides the design tokens and component styles, and your project overrides come last so they always win.
Theme switching ships in the baseline: the app shell includes a theme switch, tokens have light and dark values, and components render correctly in both modes without per-page work. When adding custom styles, define both variants alongside the existing token pattern rather than hard-coding colors.
For deeper changes, override the CSS variables from the olwibaCN preset in app.css after the preset import: color scales, radius, and typography are all variable-driven. Keep overrides token-level rather than styling individual components, so future olwibaCN updates keep working with your brand.
If you find yourself repeatedly styling the same primitive the same way, that is a signal the variant belongs upstream in olwibaCN or olwibaUI rather than your project. The ownership rule: project-specific glue stays local; reusable styling moves up the ecosystem so every project benefits.