Sky News color palette
MediaSky News uses a bold red and white color palette, reflecting urgency and clarity in news reporting. The brand's visual identity is built around its distinctive red, paired with neutral grays and black for contrast.
news.sky.comSky News colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Sky News RedPrimary214, 0, 28
- Sky News WhiteSecondary255, 255, 255
- Sky News BlueAccent0, 87, 184
Surfaces
Page, cards and dividers.- Sky News Light GrayBackground245, 245, 245
- Sky News Panel GraySurface230, 230, 230
- Sky News Border GrayBorder204, 204, 204
Text
Three tiers of copy.- Sky News BlackText34, 34, 34
- Sky News Dark GraySecondary text85, 85, 85
- Sky News Muted GrayMuted text136, 136, 136
Semantic
Feedback and state colors.- Sky News Success GreenSuccess46, 139, 87
- Sky News Warning YellowWarning255, 180, 0
- Sky News Error RedError214, 0, 28
- Sky News Info BlueInfo0, 87, 184
Use Sky News's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
sky-news-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0057B8;
--error: #D6001C;
--accent: #0057B8;
--border: #CCCCCC;
--primary: #D6001C;
--success: #2E8B57;
--surface: #E6E6E6;
--warning: #FFB400;
--secondary: #FFFFFF;
--text-muted: #888888;
--background: #F5F5F5;
--text-primary: #222222;
--text-secondary: #555555;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
14.6:1
Pass
Text on surface
Needs 4.5:1 for body text
12.7:1
Pass
Secondary text on background
Needs 4.5:1 for body text
6.8:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
6.0:1
Pass
Muted text on background
Needs 3:1 for large text
3.3:1
Pass
Muted text on surface
Needs 3:1 for large text
2.8:1
Fail
Sky News gray and neutral colors
The quiet part of the Sky News palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Sky News Light GrayBackground
- HEX
- RGB
- HSL
- Sky News Panel GraySurface
- HEX
- RGB
- HSL
- Sky News Border GrayBorder
- HEX
- RGB
- HSL
- Sky News BlackText
- HEX
- RGB
- HSL
- Sky News Dark GraySecondary text
- HEX
- RGB
- HSL
- Sky News Muted GrayMuted text
- HEX
- RGB
- HSL
About Sky News's colors
Sky News' palette uses a dominant red for immediacy and authority, balanced by white and neutral grays for readability and structure. Blue is used sparingly for highlights and informational cues.
Red and white create strong contrast for headlines and branding.
Blues are used for links and informational elements.
Grays provide neutral backgrounds and support legibility.
Psychology
Red conveys urgency, action, and importance, aligning with breaking news. White and gray tones ensure clarity and trustworthiness in presentation.
Evolution
The core red and white palette has remained consistent since Sky News' launch, reinforcing brand recognition. Minor adjustments to gray tones and the introduction of blue accents have modernized the UI.
Where Sky News uses each color
- Primary
Sky News Red is used in the logo, navigation bar, and breaking news banners.
- Secondary
Sky News White is the main background color for articles and content areas.
- Accent
Sky News Blue highlights links, buttons, and selected UI elements.
- Backgrounds
Sky News Light Gray is used for page backgrounds and section dividers.
- Text
Sky News Black and Dark Gray are used for headlines and body text respectively.
- Semantic
Success, warning, and error colors are used in notifications and status indicators.
Sky News color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Sky News brand color is #D6001C, known as Sky News Red.
Sky News Red (#D6001C) is RGB(214, 0, 28) and CMYK(0, 100, 87, 16).
Sky News uses several grays including #F5F5F5 (Light Gray), #E6E6E6 (Panel Gray), and #CCCCCC (Border Gray) for backgrounds and UI surfaces.
Use Sky News Red (#D6001C) for primary branding and urgent elements, white and grays for backgrounds, and blue for accents and informational highlights.
The secondary color is Sky News White, #FFFFFF, and the accent is Sky News Blue, #0057B8. Together with the primary they make up the three brand colors at the top of this page.
5 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 Sky News's colors consistently when it generates UI.
Make something in the spirit of Sky News
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.