HomeDevWhite color codes
Color tools

White color codes

White color codes for #FFFFFF — HEX, RGB, HSL, HSV, shades, named whites, and copy-ready CSS.

Loading tool…

Loading Preparing tool…

How to use

Follow these steps for a clear answer.

1

Explore the base color

Review HEX, RGB, HSL, and HSV for white, then browse shades, tints, tones, and hues.

2

Pick a variation or named shade

Click a generated strip or a CSS named white shade to load codes and harmonies.

3

Copy for CSS

Copy HEX, rgb(), hsl(), or the keyword—and check contrast on white and black.

Color formulas

Core relationships used by this color tool.

CSS white#FFFFFF = rgb(255, 255, 255) = hsl(0°, 0%, 100%)
Shadesame H/S, lower L (mix toward black)
Tintsame H/S, higher L (mix toward white)
ComplementH + 180° (any saturated accent (commonly blue/black))
iHSV (or HSB) keeps hue with saturation and value; HSL uses lightness. Named shades in this family follow CSS Color Module keywords.

Example colors

Common picks with formula and result.

ϟ

Base white

CSS keyword

color: white;
#FFFFFF · rgb(255, 255, 255)
ϟ

Related shade

Family neighbor

snow
#FFFAFA
ϟ

UI accent

Background use

background-color: #FFFFFF;
Pair with readable text
ϟ

Complement direction

Harmony hint

H + 180°
Toward any saturated accent (commonly blue/black)

White color family specification

Version 1.0.0

Definition
White in CSS centers on the keyword white (#FFFFFF / rgb(255, 255, 255) / hsl(0°, 0%, 100%)). Designers use white families for clarity, space, and simplicity on screens.
What it calculates
White family variations (shades, tints, tones, hues), named CSS shades, harmony sets, HEX/RGB/HSL/HSV codes, and contrast vs white/black.
Inputs
  • Selected variation chip, named shade, or harmony swatch
  • Section mode (variations, named shades, harmonies)
Outputs
  • HEX, RGB, HSL, HSV
  • Optional CSS keyword
  • Contrast ratios on white and black
Formula
Shades/tints/tones adjust HSL L or S from base H; harmonies offset H on the hue circle

White is the default canvas. Off-whites (snow, whitesmoke, ivory) add subtle depth without leaving the neutral family.

For full keyword search across all hues, use HTML color codes. For palette generation, try the color scheme generator or color wheel.

:root {
  --white: #ffffff;
  --white-soft: #f5f5f5;
  --ink: #111111;
}

.banner {
  background-color: var(--white);
  color: #ffffff;
}
Popular CSS whites
NameHEXRGBFeel
white#FFFFFF255, 255, 255Base keyword
snow#FFFAFA255, 250, 250Light tint
ghostwhite#F8F8FF248, 248, 255Named shade
whitesmoke#F5F5F5245, 245, 245Light tint
ivory#FFFFF0255, 255, 240Named shade
azure#F0FFFF240, 255, 255Named shade
mintcream#F5FFFA245, 255, 250Light tint
floralwhite#FFFAF0255, 250, 240Named shade
aliceblue#F0F8FF240, 248, 255Named shade
antiquewhite#FAEBD7250, 235, 215Named shade
beige#F5F5DC245, 245, 220Named shade
honeydew#F0FFF0240, 255, 240Named shade
i Related hues may appear in Named shades when useful for white-adjacent palettes.
Assumptions
  • Base keyword white = #FFFFFF in sRGB.
  • Named list uses CSS Color Module keywords in/near the white family.
  • Tool runs locally; nothing is uploaded.
Units
  • HEX: #RRGGBB
  • RGB: 0–255
  • HSL/HSV: hue degrees; S/L/V percent
Boundary conditions
  • Lightness/saturation steps stay within visible ranges (~0–100%).
  • Hue offsets wrap modulo 360°.
Example
white → #FFFFFF; complementary toward any saturated accent (commonly blue/black)
Validation cases
  • white → #FFFFFF
  • whitesmoke → #F5F5F5
  • shade of white → same hue, lower lightness
  • tint of white → same hue, higher lightness
Sources
  • CSS Color Module named colors (white family)
  • Classical shade/tint/tone and hue-harmony geometry
  • WCAG relative-luminance contrast
Calculation version
1.0.0
◉ Silver color codes › ◉ Gray color codes › ◉ Ivory color codes › # HTML color codes › ◌ Color wheel ›

Frequently asked questions

Key distinctions behind the tool.

What is the hex code for white?

The CSS named color white is #FFFFFF, equal to rgb(255, 255, 255) and hsl(0°, 0%, 100%).

What is the difference between white and whitesmoke?

White is pure #FFFFFF. WhiteSmoke is a soft gray-white for layered surfaces.

What colors go with white?

Almost any brand color. Prefer dark ink for body text; soft grays for secondary UI. Always check text contrast.

Is white good for body text?

White text needs dark backgrounds. On white surfaces use near-black (#111–#333) for readable copy.

How do I use white in CSS?

Use color: white;, color: #FFFFFF;, or color: rgb(255, 255, 255); on any property that accepts a <color> value, including background-color and border-color.