Home > @uniformdev/design-system > utilityColors

utilityColors variable

Uniform utility colors exports the following css variables: --utility-caution-icon: #facc15; --utility-caution-title: #854d0e; --utility-caution-container: #fefce8; --utility-danger-icon: #f87171; --utility-danger-title: #991b1b; --utility-danger-container: #fef2f2; --utility-info-icon: #60a5fa; --utility-info-title: #1e40af; --utility-info-container: #eff6ff; --utility-note-icon: var(--gray-400); --utility-note-title: var(--gray-800); --utility-note-container: var(--gray-50); --utility-success-icon: #4ade80; --utility-success-title: #166534; --utility-success-container: #f0fdfa;

Signature:

Example 1

directly on the component <></div>

Example 2

css-in-js my-component { $}