Status colors are among the most universally understood color conventions in UI design. Red means error or danger. Green means success or positive. Amber/yellow means warning or caution. Blue means informational. These associations are so deeply ingrained that deviating from them creates confusion.
Choosing Specific Shades
The convention dictates the hue family, but you still need to choose the right shade. Your status colors should be distinct from your brand colors. If your primary brand color is red, your error red needs to be a clearly different red (different saturation, different lightness) to avoid confusion between "brand element" and "something went wrong."
Light and Dark Variants
Each status color typically needs three variants: a light background tint (for alert banners and notification backgrounds), the full-strength color (for icons, borders, and text accents), and a dark variant (for text within the alert). A success alert might use: #f0fdf4 background, #16a34a border and icon, #166534 text.
Accessibility Requirements
Status colors carry critical information. Users need to be able to read error messages and understand warnings. Every status color combination must meet WCAG AA at minimum. The colored text within an alert must have 4.5:1 contrast against the alert's background tint.
Never Color Alone
This is the most important rule for status colors: never use color as the sole indicator. Every error needs an icon and descriptive text alongside the red. Every success needs a checkmark alongside the green. Users who cannot perceive the color still need to understand the status.