---
title: "Rocket Chat Brand Colours Guide"
slug: "colors"
description: "Review Rocket Chat brand colours. Ensure visual consistency, professional design, and recognisable communications."
updated: 2026-10-14T16:20:08Z
published: 2026-10-14T16:20:08Z
canonical: "docs.rocket.chat/colors"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.rocket.chat/llms.txt
> Use this file to discover all available pages before exploring further.

# Colors

This page describes the Rocket.Chat color palette and how to apply it.

## Brand palette

| Color | HEX | RGB | Main use |
| --- | --- | --- | --- |
| **Rocket Red** | `#F5455C` | 245 69 92 | Logo, brand accents and icons |
| **Brand Dark** | `#1F2329` | 31 35 41 | Headings, emphasized text and dark backgrounds |
| **Brand Gray** | `#6C727A` | 108 114 122 | Body text and secondary text |
| **Cloud Gray** | `#F7F8FA` | 247 248 250 | Light backgrounds |
| **Link Blue** | `#156FF5` | 21 111 245 | Links |
| **White** | `#FFFFFF` | 255 255 255 | Backgrounds and the logo on dark backgrounds |

## ![](https://cdn.us.document360.io/6ae79a05-7252-45d0-96e8-8f375e07b1b2/Images/Documentation/color-usage.png)

## 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 [Typograph](https://docs.rocket.chat/docs/typography)y article.