scss-conventions

Installation
SKILL.md

SCSS Conventions

Why these rules exist

OUDS Web uses token-driven multi-brand theming. Strict SCSS conventions ensure that token variables resolve correctly across 3 brands, dark mode works via CSS custom properties, RTL is handled by rtlcss, and Stylelint catches violations in CI.


Variable naming

Formula: $component-state-property-size

$nav-link-disabled-color
$modal-content-box-shadow-xs
$btn-padding-y

Every module-scope variable requires !default (allows consumer overrides). Local variables in mixins/functions are exempt.

Installs
1
GitHub Stars
224
First Seen
Oct 13, 2026