RGB
The rgb() functional notation expresses a color in the sRGB color space according to its red, green, and blue components. An optional alpha component represents the color's transparency.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 1 | 12 | 1 | 1 | 18 | 1 | |
rgb alpha parameter Alpha parameter | 65 | 79 | 52 | 12.1 | 65 | 12.2 |
rgb float values Float values in parameters | 66 | 79 | 52 | 12.1 | 66 | 12.2 |
rgb mixed type parameters Mix `<percentage>` and `<number>` in parameters | 122 | 122 | 113 | 18 | 122 | 18 |
rgb space separated parameters Space-separated rgb() parameters | 65 | 79 | 52 | 12.1 | 65 | 12.2 |
| The CSS data type is a notation for describing the hexadecimal color syntax of an sRGB color using its primary color components (red, green, blue) written as hexadecimal numbers, as well as its transparency. | 1 | 12 | 1 | 1 | 18 | 1 |
rgb hexadecimal notation alpha hexadecimal notation RGBA hexadecimal notation (`#RRGGBBAA`, `#RGBA`) | 62 | 79 | 49 | 10 | 62 | 9.3 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
.element {
color: rgb(255 99 71);
background: rgba(0, 0, 0, 0.5);
border-color: #3498db;
}Live demo
Use cases
-
Direct color specification
Define precise interface colors or generated values from design tooling and code utilities.
-
Transparent overlays
Use alpha-enabled rgb values for shadows, overlays, and layered interface surfaces.
Cautions
- Raw channel values can be harder to reason about semantically than named tokens or HSL-like systems.
- Precision alone does not ensure accessible color pairings.
Accessibility
- Even when color values come directly from design tools, validate contrast in the actual component context.