# Slack

> `slack@1.0.0`

Slack is a channel-based messaging and collaboration platform for modern work, owned by Salesforce since the 2021 acquisition. The brand voice is warm, conversational, and human — "where work happens." Visually, the 2019 Pentagram-led rebrand replaced the earlier eleven-color identity with a tight four-color octothorpe mark anchored on Slack Aubergine, designed so the brand reads instantly against the white of competing desktop windows.


**Tags:** `saas`, `productivity`, `slack`, `salesforce`, `messaging`

## Atoms

### Palette

**Slack** · `slack@1.0.0` · Proprietary — All Rights Reserved

> Slack's brand palette, anchored on the signature Slack Aubergine (#4A154B) and the four quadrant colors of the octothorpe mark introduced in the 2019 Pentagram-led rebrand: green, blue, yellow, and a hot pink-red. Aubergine reads as the institutional voice; the four quadrant colors carry the playful, conversational accent layer. 

### Fonts

| Role | Font | License | Classification |
|------|------|---------|----------------|
| `heading` | **Slack Sans** `(slack-sans@1.0.0)` | Proprietary — All Rights Reserved | sans-serif |
| `body` | **Slack Sans** `(slack-sans@1.0.0)` | Proprietary — All Rights Reserved | sans-serif |
| `mono` | **JetBrainsMono Nerd Font** `(jetbrainsmono-nerdfont@1.0.0)` | OFL-1.1 | monospace |

## Swatches

| ID | Name | Value |
|----|------|-------|
| `aubergine` | Slack Aubergine | `#4A154B` |
| `slack-green` | Slack Green | `#2EB67D` |
| `slack-blue` | Slack Blue | `#36C5F0` |
| `slack-yellow` | Slack Yellow | `#ECB22E` |
| `slack-red` | Slack Red | `#E01E5A` |
| `slack-white` | Slack White | `#FFFFFF` |
| `slack-black` | Slack Black | `#1D1C1D` |
| `slack-surface-light` | Slack Surface Light | `#F4F4F4` |
| `slack-surface-dark` | Slack Surface Dark | `#2C2D30` |
| `slack-text-secondary` | Slack Text Secondary | `#616061` |
| `slack-text-tertiary` | Slack Text Tertiary | `#868686` |
| `slack-text-on-dark-secondary` | Slack Text Secondary (Dark) | `#ABABAD` |

## Mode role mappings

### Light mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `slack-white` | `#FFFFFF` |
| `surface` | `slack-surface-light` | `#F4F4F4` |
| `surface-elevated` | `slack-white` | `#FFFFFF` |
| `text-primary` | `slack-black` | `#1D1C1D` |
| `text-secondary` | `slack-text-secondary` | `#616061` |
| `text-tertiary` | `slack-text-tertiary` | `#868686` |
| `primary` | `aubergine` | `#4A154B` |
| `primary-hover` | `aubergine` | `#4A154B` |
| `accent` | `slack-green` | `#2EB67D` |
| `accent-hover` | `slack-green` | `#2EB67D` |
| `warning` | `slack-yellow` | `#ECB22E` |
| `warning-hover` | `slack-yellow` | `#ECB22E` |
| `error` | `slack-red` | `#E01E5A` |
| `success` | `slack-green` | `#2EB67D` |

### Dark mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `aubergine` | `#4A154B` |
| `surface` | `slack-surface-dark` | `#2C2D30` |
| `surface-elevated` | `slack-black` | `#1D1C1D` |
| `text-primary` | `slack-white` | `#FFFFFF` |
| `text-secondary` | `slack-text-on-dark-secondary` | `#ABABAD` |
| `text-tertiary` | `slack-text-tertiary` | `#868686` |
| `primary` | `slack-blue` | `#36C5F0` |
| `primary-hover` | `slack-blue` | `#36C5F0` |
| `accent` | `slack-green` | `#2EB67D` |
| `accent-hover` | `slack-green` | `#2EB67D` |
| `warning` | `slack-yellow` | `#ECB22E` |
| `warning-hover` | `slack-yellow` | `#ECB22E` |
| `error` | `slack-red` | `#E01E5A` |
| `success` | `slack-green` | `#2EB67D` |

## Brand semantic roles

### Colors

| Role | Swatch | Hex |
|------|--------|-----|
| `identity` | `aubergine` | `#4A154B` |
| `on-identity` | `slack-white` | `#FFFFFF` |
| `primary` | `aubergine` | `#4A154B` |
| `primary-hover` | `aubergine` | `#4A154B` |
| `accent` | `slack-green` | `#2EB67D` |
| `accent-hover` | `slack-green` | `#2EB67D` |
| `accent-blue` | `slack-blue` | `#36C5F0` |
| `accent-yellow` | `slack-yellow` | `#ECB22E` |
| `accent-red` | `slack-red` | `#E01E5A` |
| `success` | `slack-green` | `#2EB67D` |
| `warning` | `slack-yellow` | `#ECB22E` |
| `error` | `slack-red` | `#E01E5A` |
| `background-light` | `slack-white` | `#FFFFFF` |
| `background-dark` | `aubergine` | `#4A154B` |
| `surface-light` | `slack-surface-light` | `#F4F4F4` |
| `surface-dark` | `slack-surface-dark` | `#2C2D30` |
| `text-primary-light` | `slack-black` | `#1D1C1D` |
| `text-primary-dark` | `slack-white` | `#FFFFFF` |

### Typography

| Role | Font role key |
|------|---------------|
| `display` | `heading` |
| `prose` | `body` |
| `code` | `mono` |

## Rules

### 🛑 error (7)

#### `colorChoice` → `logo.mark`

- **allowed:** aubergine, slack-green, slack-blue, slack-yellow, slack-red, slack-white, slack-black
- **forbidden:** any-non-brand-color

> The four quadrant colors of the Slack mark and Aubergine are the only documented brand colors. Recoloring the mark into off-brand hues violates Slack's brand-use guidelines as published at slack.com/media-kit. 

#### `forbiddenTreatment` → `logo`

- **treatments:** stretched, rotated, recolored, drop-shadow, on-busy-photo, inverted-without-variant, cropped, reordered-quadrants

> Slack's media kit explicitly prohibits stretching, rotating, recoloring, applying effects to, or rearranging the quadrants of the Slack mark. The four-color octothorpe is a fixed composition. 

#### `contrastRatio` → `text-primary`

- **against:** `background`
- **minRatio:** `4.5`
- **standard:** `WCAG-AA`

> WCAG 2.1 Level AA contrast minimum for body text. Slack Black (#1D1C1D) on Slack White (#FFFFFF) clears AA comfortably; Slack White on Aubergine (#4A154B) also clears AA. 

#### `variantSelection` → `logo`

- **use:** `logo-light-on-dark`
- **when:** `backgroundColorScheme="dark"`

> On dark surfaces (including the canonical Aubergine canvas), the light-on-dark wordmark variant is required for legibility. Do not invert the mark file on the fly. 

#### `variantSelection` → `logo`

- **use:** `logo-dark-on-light`
- **when:** `backgroundColorScheme="light"`

> On light surfaces, use the dark-on-light wordmark variant where the wordmark renders in Aubergine. Do not place the light-on-dark variant on white. 

#### `contextRestriction` → `logo.mark`

- **forbiddenContexts:** product-of-competitor, merchandise, endorsement-implication

> Slack's trademark guidelines forbid use of the mark in a way that implies endorsement, on third-party merchandise, or on competing-product surfaces without explicit license. 

#### `accessibilityRequirement` → `*`

- **standard:** `WCAG-AA`
- **criterion:** `1.4.3`

> WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. All Slack-skinned interfaces must clear AA at minimum. 

### ⚠️ warning (1)

#### `enumMembership` → `typography.heading.fontWeight`

- **allowed:** 500, 700, 900

> Slack Sans is distributed with discrete weights Regular (400), Medium (500), Bold (700), and Black (900). Headings use 500 and above to maintain Slack's bold-typographic voice. 

### 💡 recommendation (1)

#### `compositionConstraint` → `roles.colors.identity`

- **pairsWith:** slack-white, slack-black
- **doesNotPairWith:** slack-yellow

> Aubergine + Slack Yellow combinations fight without resolving; Aubergine pairs cleanly with white and with the green/blue quadrants. Reserve yellow for accents on a neutral canvas. 

## Provenance

- **Source:** <https://slack.com/media-kit>
- **License:** `Proprietary — All Rights Reserved`
- **Attribution:** Slack and the Slack mark are trademarks of Slack Technologies, LLC, a Salesforce company. brand-atoms reads only the publicly documented core palette and proprietary-font identity; licensed application of the Slack name and mark is governed by Slack's brand-use program at slack.com/media-kit and the Slack trademark guidelines. 
- **Imported:** `2026-05-17`
- **Notes:** Slack Sans, Slack's proprietary corporate typeface, is referenced here as the canonical brand face. The fallbackStack on slack-sans@1 specifies Lato as the public-web fallback when the licensed file is not available. 

---

*Generated by the brand-atoms converter. Source: `slack@1.0.0` from the encyclopedia.*
