Skip to content
MightyPaint
  • Acrylic Paint
  • Spray Paint
  • Paint Guide
  • Home Decor
MightyPaint

Color Names & HTML (HEX) Codes Chart (Full Shades List)

Updated onApril 23, 2025
Save This On Pinterest! Follow Us on Pinterest

Choosing the right hue—whether for a website header or a living‑room accent wall—starts with knowing its exact code. This page compiles every official HTML color name and HEX code into a single, scroll‑able chart, complete with live swatches you can click to copy straight into your CSS or design software. No more guesswork, no more hunting through scattered lists.

Beyond pixels, these color chips double as a quick‑reference palette for real‑world projects. Planning a nursery repaint? Curious how Sea Green compares to Mint Cream on your trim? Grab the HEX value here, plug it into any paint‑matching app, and visualize the shade on your next mood board before buying a single gallon. Interior designers and DIYers can treat this chart like a digital fan deck—perfect for coordinating throw pillows with brand colors or testing front‑door paint ideas pulled from your website’s theme.

Scroll down to explore the full chart by shade family, copy codes on the fly, and bookmark the page for your next dev sprint or weekend redecorating session.

If you’d rather experiment visually, try the interactive color-picker grid where you can click any hue and copy its HEX instantly.

Quick‑Copy Master Table of HTML Color Names

Below you’ll find the heart of this page: a full, alphabetized chart of all 140+ HTML/CSS color names, each displayed as an actual swatch so you can judge the hue at a glance. We’ve grouped the list by shade family—reds with reds, blues with blues—so you can jump to the palette you need without endless scrolling. Whether you’re coding a button border or hunting for the perfect accent wall, every color here comes with an instant‑copy HEX value to keep your workflow fast and friction‑free.

How to Use the Table

  1. Scan or jump — Use your browser’s “find” (⌘/Ctrl + F) or the page jump links in the sidebar (if you enabled them) to go straight to a color family.
  2. Preview in real time — Each swatch tile is rendered with the exact HEX code, so what you see is precisely what will display in a browser—or on a paint‑matching app.
  3. Copy on click — Click (or double‑tap on mobile) any HEX cell to copy the code to your clipboard, then paste it into your CSS, Figma file, or color‑matching software.
Additional Read:  Color Palette Generator: Craft Your Perfect Spectrum

Tip for home‑improvers: Paste the HEX into a digital paint‑visualizer tool (e.g., Sherwin‑Williams ColorSnap or Behr’s ColorSmart) to see how that web shade translates to real‑world paint before you spend a dime at the hardware store.

Legend — Swatch | Color Name | HTML (HEX) Code

ColumnWhat It ShowsWhy It Matters
SwatchA live color tile rendered in your browser.Lets you eyeball the hue instantly—no need to imagine what “Light Sky Blue” looks like.
Color NameThe official W3C color keyword (split into readable words).Valid as a direct CSS value (color: HotPink;) and handy for design discussions.
HTML (HEX) CodeA six‑digit hexadecimal value preceded by #.Universally accepted in CSS, design software, and paint‑matching apps for pinpoint accuracy.

Scroll on to explore the table and grab the shades that match your brand palette, blog theme, or living‑room mood board.

HTML Color Names & HEX Codes Chart

What Are HTML Color Names?

Origin of the 140 “Web‑Safe” Colors

Back in the dial‑up 1990s, early browsers (think Netscape Navigator) could safely display only 216 colors on 8‑bit monitors without dithering. From that palette, the W3C standardized 140 keyword names—from classic Red to quirky Papaya Whip—so designers and coders could reference hues with human‑friendly words instead of numbers. Those names remain valid in every modern browser, which is why you can still write color: HotPink; today and get the exact same shade your visitors see.

HTML vs. CSS vs. RGB/HSL Codes

While the keywords are convenient, production code usually relies on numeric values for precision and flexibility—especially when you need intermediate tints or alpha transparency.

Additional Read:  Instant Contrast Ratio Checker for Designers & Developers

Pro tip: HEX and RGB are interchangeable; browsers parse them instantly. HSL is designer‑friendly because you can tweak lightness or saturation without recalculating red‑green‑blue channels.

HEX ↔ RGB Conversion

A HEX code is simply the base‑16 shorthand for its RGB triplet (FF hex = 255 decimal). You can convert either way with a quick calculator or, if you prefer no math, punch the HEX into our HEX‑to‑RGB Converter tool and copy the result. That same value also drops cleanly into most paint‑matching apps, letting you preview a digital hue—say, #3CB371 (Medium Sea Green)—on a kitchen cabinet mock‑up before you break out the rollers.

Color Categories by Shade — Picking Palettes That Pop

A color chart is most useful when you can translate codes into practical pairings. Below you’ll find seven quick‑reference overviews—one for each major hue family—highlighting signature HTML colors, real‑world design moods, and décor ideas. Use these mini‑guides to zero‑in on a palette for your website and to inspire a fresh coat of paint on your next room makeover.

Red & Pink Tones

  Key HTML shades: Crimson, Fire Brick, Deep Pink, Light Coral

  • Digital vibe: urgency, passion, click‑me call‑to‑actions (CTAs)
  • Home‑decor angle: perfect for accent walls, statement doors, or Valentine’s tablescapes. Try pairing Indian Red with neutral linen for a cozy reading nook.

Orange & Yellow Tones

  Key HTML shades: Tomato, Dark Orange, Gold, Khaki

  • Digital vibe: optimism, energy, “Buy Now” buttons, data‑viz highlights
  • Home‑decor angle: brighten a small kitchen with Light Salmon cabinets or lift a neutral bedroom with Peach Puff throw pillows.

Green Tones

  Key HTML shades: Lime Green, Sea Green, Medium Spring Green, Olive

  • Digital vibe: growth, success badges, eco‑friendly branding
  • Home‑decor angle: Pale Green walls create a spa‑like bathroom; Olive Drab works on shaker cabinets for that farmhouse look.
Additional Read:  Color and Culture: Exploring Global Interpretations of Color

Blue & Aqua Tones

  Key HTML shades: Dodger Blue, Deep Sky Blue, Turquoise, Midnight Blue

  • Digital vibe: trust, security messaging, SaaS dashboards
  • Home‑decor angle: pair Light Sky Blue with white shiplap for a coastal bedroom, or use Navy to anchor a moody office accent wall.

Purple Tones

  Key HTML shades: Medium Purple, Indigo, Lavender, Fuchsia

  • Digital vibe: creativity, luxury, Calls‑to‑share on social banners
  • Home‑decor angle: Amethyst throw blankets on a gray sofa, or Lavender nursery walls balanced with warm wood tones.

Brown & Earth Tones

  Key HTML shades: Peru, Saddle Brown, Wheat, Rosy Brown

  • Digital vibe: grounding backgrounds, organic‑brand packaging, coffee‑shop menus
  • Home‑decor angle: Burly Wood trims for boho interiors or Goldenrod in rattan accents to warm up white walls.

White & Grey Tones

  Key HTML shades: White Smoke, Gainsboro, Dim Gray, Black

  • Digital vibe: minimal UI, negative space, dark‑mode toggles
  • Home‑decor angle: use Ghost White on ceilings to lift a room, or contrast Light Slate Gray cabinetry with brass hardware for a modern twist.

FAQs About HTML Color Codes

1. How many HTML color names are supported in 2025?
Modern browsers still support the same 147 keyword names formalised by the W3C (often rounded to “140 colors”). From Black to the whimsical Papaya Whip, each renders identically in Chrome, Firefox, Safari and Edge.

2. Why do Fuchsia and Magenta show the exact same shade?
Both keywords are hard‑wired to the identical RGB value #FF00FF. They were kept as separate names for historical reasons and designer preference, even though they display the same colour.

3. Is using a keyword like Red slower than #FF0000?
No. When a browser parses CSS, it converts keywords to their numeric RGB values almost instantly. Performance is identical, so choose the format your team finds most readable.

4. Which spelling is correct in CSS — Gray or Grey?
Only the American spelling Gray (#808080) is recognised as a valid keyword. Typing Grey results in an undefined colour, causing the browser to fall back to the default text colour. Use Gray in code; use grey in prose only if your style guide requires British English.

Follow us on Pinterest
Follow
Risalat
Facebook Pinterest
  • About Us
  • Contact
  • Privacy Policy
  • Disclaimer
  • DMCA
  • Image Credit

© 2025 MightyPaint

  • Acrylic Paint
  • Spray Paint
  • Paint Guide
  • Home Decor