Vimeo color palette
EntertainmentVimeo's color identity centers on a vibrant blue, supported by clean neutrals and subtle accents for a modern, approachable look. The palette is designed for clarity and accessibility across digital platforms.
vimeo.comVimeo colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Vimeo BluePrimary26, 183, 234
- Vimeo CharcoalSecondary22, 34, 33
- Vimeo YellowAccent255, 210, 0
Surfaces
Page, cards and dividers.- Vimeo WhiteBackground255, 255, 255
- Vimeo Light GraySurface245, 247, 250
- Vimeo Border GrayBorder230, 232, 235
Text
Three tiers of copy.- Vimeo CharcoalText22, 34, 33
- Vimeo Secondary GraySecondary text107, 124, 147
- Vimeo Muted GrayMuted text163, 173, 184
Semantic
Feedback and state colors.- Vimeo GreenSuccess47, 196, 122
- Vimeo YellowWarning255, 210, 0
- Vimeo RedError255, 82, 82
- Vimeo BlueInfo26, 183, 234
Use Vimeo's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
vimeo-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1AB7EA;
--error: #FF5252;
--accent: #FFD200;
--border: #E6E8EB;
--primary: #1AB7EA;
--success: #2FC47A;
--surface: #F5F7FA;
--warning: #FFD200;
--secondary: #162221;
--text-muted: #A3ADB8;
--background: #FFFFFF;
--text-primary: #162221;
--text-secondary: #6B7C93;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
16.3:1
Pass
Text on surface
Needs 4.5:1 for body text
15.2:1
Pass
Secondary text on background
Needs 4.5:1 for body text
4.3:1
Fail
Secondary text on surface
Needs 4.5:1 for body text
4.0:1
Fail
Muted text on background
Needs 3:1 for large text
2.3:1
Fail
Muted text on surface
Needs 3:1 for large text
2.1:1
Fail
Vimeo background, border and text colors
The quiet part of the Vimeo palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Vimeo WhiteBackground
- HEX
- RGB
- HSL
- Vimeo Light GraySurface
- HEX
- RGB
- HSL
- Vimeo Border GrayBorder
- HEX
- RGB
- HSL
- Vimeo CharcoalText
- HEX
- RGB
- HSL
- Vimeo Secondary GraySecondary text
- HEX
- RGB
- HSL
- Vimeo Muted GrayMuted text
- HEX
- RGB
- HSL
About Vimeo's colors
Vimeo's palette is anchored by a signature blue, complemented by neutral grays and a bright yellow accent. The system prioritizes legibility and a clean, professional appearance.
Primary blue is paired with dark charcoal for contrast.
Yellow accent highlights calls to action.
Grays are used for backgrounds and UI surfaces.
Psychology
The blue conveys trust, creativity, and approachability, aligning with Vimeo's creative community. Yellow adds energy and draws attention to key elements.
Evolution
Vimeo's palette has remained consistent, with blue always at the center. Minor adjustments to gray tones and accent colors have improved accessibility and clarity.
Where Vimeo uses each color
- Primary
Used for logo, primary buttons, and key highlights across the website and app.
- Secondary
Appears in navigation bars, footers, and text for strong contrast.
- Accent
Highlights notifications, badges, and important call-to-action buttons.
- Backgrounds
White and light gray backgrounds are used throughout the UI for clarity.
- Text
Charcoal and secondary gray are used for primary and secondary text respectively.
- Semantic
Green, yellow, and red are used for success, warning, and error states in forms and notifications.
Vimeo color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Vimeo primary color hex code is #1AB7EA. This blue is used for the logo and primary actions.
Vimeo Blue (#1AB7EA) is RGB(26, 183, 234) and CMYK(89, 11, 0, 8). Use these values for print and digital consistency.
Vimeo uses #162221 (Vimeo Charcoal) for dark UI elements and #F5F7FA (Vimeo Light Gray) for backgrounds. These neutrals support the brand's clean design.
Apply #1AB7EA for primary actions, #162221 for text and navigation, and #FFD200 for accents. Use the grays for backgrounds and surfaces to maintain clarity.
The secondary color is Vimeo Charcoal, #162221, and the accent is Vimeo Yellow, #FFD200. Together with the primary they make up the three brand colors at the top of this page.
2 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies Vimeo's colors consistently when it generates UI.
Make something in the spirit of Vimeo
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.