This page describes the Rocket.Chat color palette and how to apply it.
Brand palette
Color | HEX | RGB | Main use |
|---|---|---|---|
Rocket Red |
| 245 69 92 | Logo, brand accents and icons |
Brand Dark |
| 31 35 41 | Headings, emphasized text and dark backgrounds |
Brand Gray |
| 108 114 122 | Body text and secondary text |
Cloud Gray |
| 247 248 250 | Light backgrounds |
Link Blue |
| 21 111 245 | Links |
White |
| 255 255 255 | Backgrounds and the logo on dark backgrounds |
Logo color versions
The logo always appears in a single color: red, white or black. Never combine two colors in one logo.
Red (default): on white or light backgrounds. The whole logo is Rocket Red.
White: on dark or colored backgrounds. The whole logo is white.
Black: on light backgrounds when color printing isn't available. The whole logo is black.
On photos or busy backgrounds: place the logo on a solid container, or use the white or black version with strong contrast.
Text colors
Headings use Brand Dark (
#1F2329).Body text uses Brand Gray (
#6C727A) for softer contrast, or Brand Dark for emphasis.
For the full type system, see the Typography article.