Rules Hub
Code Ruleset
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
Define palette colors as opaque hex, not rgba
Keep solid palette colors and intentionally translucent tokens distinct; do not bake accidental opacity into a solid-color contract.
Bad example
| 1 | $border: rgba(0, 0, 0, 0.12); |
Explanation (EN)
An accidentally translucent base color can vary across backgrounds when a solid surface was intended.
Objašnjenje (HR)
Good example
| 1 | $border: #e0e0e0; |
Explanation (EN)
An opaque hex token looks the same everywhere; use rgba only for deliberate overlays.
Objašnjenje (HR)
Notes (EN)
Distinguish solid palette tokens from intentional translucent overlay/border tokens and select the token that matches the design contract on its supported backgrounds.
Exceptions / Tradeoffs (EN)
Alpha tokens are valid design-system values. Replacing rgba with a sampled opaque color changes compositing on other backgrounds; hex is not inherently more correct than modern rgb/oklch.