Off White

A light white with a slight cool tone, a classic base for minimalist modern styles

Black & WhiteCalmDigital Standard
HEX#F8F8FF
RGBrgb(248, 248, 255)
HSLhsl(240, 100%, 99%)
HSVhsv(240, 3%, 100%)
CMYKcmyk(3%, 3%, 0%, 0%)
HEXA#F8F8FFFF
RGBArgba(248, 248, 255, 1)
HSLAhsla(240, 100%, 99%, 1)
OKLCHoklch(99.2%, 0.004, 286)
LCHlch(99%, 10.6, 223)

🎨 Color Palettes

Analogous2-3 adjacent hues (≤60°)
Copy
#FAFCFF
Copy
#F8F8FF
Copy
#FCFAFF
Triadic3 hues spaced 120° apart
Copy
#F8F8FF
Copy
#FFFAFA
Copy
#FAFFFA
Split ComplementaryMain color + colors adjacent to its complement
Copy
#F8F8FF
Copy
#FFFCFA
Copy
#FCFFFA
Complementary2 hues spaced 180° apart
Copy
#F8F8FF
Copy
#FFFFFA
Tetradic (Rectangle)4 hues forming a rectangle
Copy
#F8F8FF
Copy
#FFFAFC
Copy
#FFFFFA
Copy
#FAFFFC
MonochromaticSingle hue with varying saturation and lightness
Copy
#2E2EFF
Copy
#9494FF
Copy
#F8F8FF
Copy
#FFFFFF
Copy
#FFFFFF

♿ WCAG Contrast Colors

Learn More →
Aa14px Body
High Contrast Text
#2929FFRatio 7:1AAA
Suitable for body text, headings, and primary content, ensuring readability for all users
Aa14px Body
Standard Text
#9C38FFRatio 4.5:1AA
Suitable for regular body content, meeting WCAG AA standards
Aa14px Body
Large Text / UI Components
#FF05FFRatio 3:1AA Large
Suitable for large text (≥18px bold or ≥24px), icons, UI component boundaries
Aa14px Body
Decorative / Dividers
#FF9494Ratio 2:1Fail
Suitable for decorative elements, dividers, non-essential text

📊 Color Scales

Online Color Picker → Gradient Generator →
Lightness VariationFixed hue and saturation, proportional lightness scaling 30%→100%
#000099Copy
#0000D1Copy
#0F0FFFCopy
#4747FFCopy
#8585FFCopy
#BDBDFFCopy
#FAFAFFCopy
Saturation VariationFixed hue and lightness, proportional saturation scaling 40%→100%
#FBFBFDCopy
#FBFBFECopy
#FBFBFECopy
#FBFBFECopy
#FAFAFECopy
#FAFAFFCopy
#FAFAFFCopy
Lightness + Saturation Mixed VariationSimultaneous lightness and saturation proportional scaling
#363663Copy
#3D3D94Copy
#4848C7Copy
#6868DFCopy
#9393F1Copy
#C1C1FBCopy
#FAFAFFCopy
Hue Fine-TuningFixed saturation and lightness, stepwise hue fine-tuning ±15°
#FAFBFFCopy
#FAFBFFCopy
#FAFAFFCopy
#FAFAFFCopy
#FAFAFFCopy
#FBFAFFCopy
#FBFAFFCopy

💡 Use Cases

💻

Interface Design

Main background color for light mode in web and app design, reducing visual fatigue from prolonged reading.

🏢

Office Space

Base color for open-plan office walls and furniture, creating an efficient and focused work environment.

📱

Consumer Electronics

Color option for smartphones and laptops, conveying the rational aesthetic of tech products through restrained white.

👔

Business Attire

Base color for summer shirts and business casual wear, a low-key and fresh professional outfit choice.

📜 Origin & History

The term 'Off-White' originally came from the textile industry, referring to the natural ecru color of unbleached cotton and linen, tinged with slight plant impurity tones—the original color of natural fibers.

In the 20th-century modernist architecture and interior design movement, off-white replaced ornate decorative colors, becoming the iconic base color for Bauhaus style and Nordic minimalist design.

In the early 21st century, Apple Inc. extensively applied off-white to product design and retail spaces, driving the mass popularity of this restrained color in the tech product sector.

In recent years, off-white has taken an important place in digital interface design. Beyond dark mode, pure white in light mode can cause eye strain, making off-white a healthier choice for screen backgrounds.

Today, off-white has become synonymous with a minimalist modern lifestyle. It's neither as cold and distant as pure white nor as sweetly soft as cream white—a restrained yet warm intermediate state.

🧠 Color Psychology

Minimalist RestraintThe subtle cool gray tone suppresses the expansive feel of white, embodying the minimalist aesthetic pursuit of 'less is more'.
Focused CalmnessThe non-distracting soft base color makes it easier to concentrate, suitable for scenarios requiring deep thought.
Modern RationalityA continuation of the Bauhaus tradition, carrying the coolness of functionalism and the orderliness of industrial civilization.
Clean and FreshThe cool base tone provides a psychological suggestion of cleanliness and freshness, like freshly washed linen sheets.
Neutral InclusivityA neutral white between warm and cool tones, without a strong emotional inclination, offering more freedom in pairing.
Healthy BalanceA screen background color suitable for extended use, conveying a technology product's care for user health.
← Back to Explore Colors