Color Win8

Windows 8 style color palette reference

Windows 8 Color Palette

Windows 8 introduced a revolutionary flat design approach in 2012, replacing the skeuomorphic Aero glass effects of Windows 7 with bold, solid colors and clean typography. The color palette was carefully curated to work across the Start Screen tiles, apps, and system UI.

πŸ“±
Historical Context: Windows 8 was a watershed moment in UI design. Its bold move to flat design influenced the entire industry β€” Apple followed with iOS 7 in 2013, and Google introduced Material Design in 2014. The Windows 8 palette was designed to look vibrant on both desktop monitors and the new generation of touch-screen devices.

The 21 Accent Colors

Windows 8 offered users 21 accent colors to personalize their Start Screen. Click any swatch to copy its hex code.

Lime#A4C400
Green#60A917
Emerald#008A00
Teal#00ABA9
Cyan#1BA1E2
Cobalt#0050EF
Indigo#6A00FF
Violet#AA00FF
Pink#F472D0
Magenta#D80073
Crimson#A20025
Red#E51400
Orange#FA6800
Amber#F0A30A
Yellow#E3C800
Brown#825A2C
Olive#6D8764
Steel#647687
Mauve#76608A
Sienna#A0522D
Dark#1D1D1D

Start Screen Preview

See how the Windows 8 Start Screen looked with the selected accent color. Click any tile color above to change the preview.

Start
Mail
Calendar
Photos
Maps
Weather
Music
Store
Settings
People
Camera
Games
News

Color Reference Table

SwatchNameHexRGB
Lime#A4C400rgb(164, 196, 0)
Green#60A917rgb(96, 169, 23)
Emerald#008A00rgb(0, 138, 0)
Teal#00ABA9rgb(0, 171, 169)
Cyan#1BA1E2rgb(27, 161, 226)
Cobalt#0050EFrgb(0, 80, 239)
Indigo#6A00FFrgb(106, 0, 255)
Violet#AA00FFrgb(170, 0, 255)
Pink#F472D0rgb(244, 114, 208)
Magenta#D80073rgb(216, 0, 115)
Crimson#A20025rgb(162, 0, 37)
Red#E51400rgb(229, 20, 0)
Orange#FA6800rgb(250, 104, 0)
Amber#F0A30Argb(240, 163, 10)
Yellow#E3C800rgb(227, 200, 0)
Brown#825A2Crgb(130, 90, 44)
Olive#6D8764rgb(109, 135, 100)
Steel#647687rgb(100, 118, 135)
Mauve#76608Argb(118, 96, 138)
Sienna#A0522Drgb(160, 82, 45)
Dark#1D1D1Drgb(29, 29, 29)

Using Windows 8 Colors in CSS

:root {
  /* Windows 8 Accent Colors */
  --win8-lime: #A4C400;
  --win8-green: #60A917;
  --win8-emerald: #008A00;
  --win8-teal: #00ABA9;
  --win8-cyan: #1BA1E2;
  --win8-cobalt: #0050EF;
  --win8-indigo: #6A00FF;
  --win8-violet: #AA00FF;
  --win8-pink: #F472D0;
  --win8-magenta: #D80073;
  --win8-crimson: #A20025;
  --win8-red: #E51400;
  --win8-orange: #FA6800;
  --win8-amber: #F0A30A;
  --win8-yellow: #E3C800;
}

/* Windows 8 style tile */
.win8-tile {
  background-color: var(--win8-cobalt);
  color: #ffffff;
  padding: 1rem;
  font-family: 'Segoe UI', sans-serif;
  font-weight: 200;
  position: relative;
}

.win8-tile::after {
  content: attr(data-label);
  position: absolute;
  bottom: 0.5rem;
  left: 0.75rem;
  font-size: 0.8rem;
}

Design Legacy

The Windows 8 color palette evolved through Windows 8.1, Windows 10, and into Windows 11. While newer versions expanded the personalization options (Windows 10 introduced 48 accent colors and Windows 11 added automatic accent color extraction from wallpapers), the original 21-color palette remains iconic and widely referenced in design resources.

πŸ’‘
Modern Usage:These colors are still excellent choices for flat UI design. They’re carefully balanced for vibrancy and readability, and most work well as accent colors against both light and dark backgrounds. The Cobalt (#0050EF) and Teal (#00ABA9) are especially popular in modern web design.
⚠️
Some of these colors (particularly Lime, Yellow, and Amber) may have insufficient contrast against white backgrounds for text usage. Always verify contrast ratios when using these as text colors per WCAG guidelines.

How to Use Color Win8?

  1. 1Choose a base color using the interactive picker or enter HEX, RGB, HSL values.
  2. 2Generate matching color palettes, schemes, or color space transformations instantly.
  3. 3Click on any color code block in the results to copy it instantly to your clipboard.

Designer Friendly

Easily match colors, check contrast ratios, and generate custom palettes for your designs.

Multi-Format Support

Supports copy-paste in HEX, RGB, RGBA, HSL, HSLA, and CSS variables formats.

Runs Locally

No internet connection required. Our color engines run instantly and cleanly inside your web browser.

Frequently Asked Questions

Is Color Win8 free to use?β–Ό
Yes, Color Win8 is 100% free with no hidden charges, premium subscriptions, or limits. You can use it as much as you need.
How does the Color Win8 tool work?β–Ό
Windows 8 style color palette reference All operations are processed entirely inside your web browser using HTML5 features. Your files or input data are never uploaded to any server.
Is my data secure with Color Win8?β–Ό
Absolutely. Since the processing runs client-side in your own browser, your data never leaves your device. This makes it completely secure and private.