Hugging Face

Hugging Face's brand palette, captured from the official brand assets page at huggingface.co/brand (Primary Yellow #FFD21E, Secondary Orange #FF9D00, Neutral Gray #6B7280) and supplemented by the live marketing-site surface colors used on huggingface.co. The brand reads as warm, approachable, and emoji-native: the yellow hug-mark is the identity anchor, the orange is the secondary warm, and a near-white canvas with deep slate text carries the long-form model-and-dataset content.

17 swatches 14 light roles 14 dark roles huggingfaceaimlcommunitywarmyellowlight-first

Swatches

hug-yellow
#FFD21E
Hugging Face's published primary — the warm yellow of the hug-mark.
hug-yellow-deep
#E6B800
Pressed / hover variant of hug-yellow for interactive surfaces.
hug-orange
#FF9D00
Hugging Face's published secondary — a warm orange that pairs with the yellow primary.
hug-orange-deep
#CC7E00
Pressed / hover variant of hug-orange.
hug-neutral
#6B7280
Hugging Face's published neutral gray — the body-meta tone.
hub-canvas
#FFFFFF
Page canvas — the bright neutral surface huggingface.co reads against.
hub-surface
#F9FAFB
Subtle elevated surface; one step warmer than canvas.
hub-surface-elevated
#F3F4F6
Card / panel surface elevated above hub-surface.
hub-border
#E5E7EB
Quiet divider on the hub canvas.
hub-ink
#111827
Primary text on hub canvas — deep slate near-black.
hub-ink-secondary
#374151
Secondary text; muted slate for body copy de-emphasis.
hub-ink-tertiary
#6B7280
Tertiary text / metadata tone — same hex as the published hug-neutral.
hub-night
#0B0F19
Dark-mode canvas — the deep slate the hub flips to.
hub-night-surface
#1F2937
Elevated surface in dark mode.
hub-night-border
#374151
Quiet divider on the hub-night canvas.
hub-success
#16A34A
Confirmation / positive state green.
hub-error
#DC2626
Error / destructive state red.

Mode role mappings

Light mode (14 roles)

accent → hug-orange
accent-hover → hug-orange-deep
background → hub-canvas
border → hub-border
error → hub-error
primary → hug-yellow
primary-hover → hug-yellow-deep
success → hub-success
surface → hub-surface
surface-elevated → hub-surface-elevated
text-primary → hub-ink
text-secondary → hub-ink-secondary
text-tertiary → hub-ink-tertiary
warning → hug-orange

Dark mode (14 roles)

accent → hug-orange
accent-hover → hug-orange-deep
background → hub-night
border → hub-night-border
error → hub-error
primary → hug-yellow
primary-hover → hug-yellow-deep
success → hub-success
surface → hub-night-surface
surface-elevated → hub-ink-secondary
text-primary → hub-canvas
text-secondary → hub-surface-elevated
text-tertiary → hub-ink-tertiary
warning → hug-orange

Provenance

Source
https://huggingface.co/brand
License
Proprietary — All Rights Reserved
Attribution
Hugging Face and the hug-mark are trademarks of Hugging Face, Inc. Primary, secondary, and neutral brand colors captured directly from the official brand-assets page at huggingface.co/brand. Surface, ink, and elevation values supplemented from the live marketing-site stylesheet on huggingface.co.
Imported
2026-05-19
Notes
The yellow / orange / neutral triplet is the published-by-brand set. The ink, surface, and dark-mode tokens are derived from the live huggingface.co stylesheet on 2026-05-19 since the brand page does not publish a full surface system. Source Sans Pro is the body face declared on the live marketing site; Source Sans 3 is the open-source rendering substitute.