Black, White & Gray

Abandoning color to return to the essence of light and shadow, the highest expression of minimalism

HEX#808080

RGBrgb(128, 128, 128)

HSLhsl(0, 0%, 50%)

HSVhsv(0, 0%, 50%)

CMYKcmyk(0%, 0%, 0%, 50%)

HEXA#808080FF

RGBArgba(128, 128, 128, 1)

HSLAhsla(0, 0%, 50%, 1)

OKLCHoklch(79.5%, 0, 90)

LCHlch(76.2%, 8.1, 214)

🎨 Color Palettes

Analogous2-3 adjacent hues (≤60°)

Triadic3 hues spaced 120° apart

Split ComplementaryMain color + colors adjacent to its complement

Complementary2 hues spaced 180° apart

Tetradic (Rectangle)4 hues forming a rectangle

MonochromaticSingle hue with varying saturation and lightness

♿ WCAG Contrast Colors

Learn More →

Aa14px Body

High Contrast Text

#FFFFFFRatio 3.9:1AA Large

Suitable for body text, headings, and primary content, ensuring readability for all users

Aa14px Body

Standard Text

#FFFFFFRatio 3.9:1AA Large

Suitable for regular body content, meeting WCAG AA standards

Aa14px Body

Large Text / UI Components

#E0E0E0Ratio 3:1AA Large

Suitable for large text (≥18px bold or ≥24px), icons, UI component boundaries

Aa14px Body

Decorative / Dividers

#B8B8B8Ratio 2:1Fail

Suitable for decorative elements, dividers, non-essential text

📊 Color Scales

Online Color Picker → Gradient Generator →

Lightness VariationFixed hue and saturation, stepwise lightness adjustment ±30%

#333333

#4D4D4D

#666666

#808080

#999999

#B3B3B3

#CCCCCC

Saturation VariationFixed hue and lightness, stepwise saturation adjustment ±30%

#8C7373

#996666

#A65959

Lightness + Saturation Mixed VariationSimultaneous lightness and saturation adjustment

#493636

#614848

#785959

#906A6A

#A28181

#B39898

#C5AFAF

Hue Fine-TuningFixed saturation and lightness, stepwise hue fine-tuning ±15°

#808080

💡 Use Cases

📷

Documentary Photography

In street or portrait photography, black, white, and gray strip away era-specific features, elevating the moment to eternity. It magnifies wrinkles, gazes, and emotional tension.

🏛️

Museum Gallery

White cube spaces and gray-toned concrete floors construct a completely neutral container, ensuring viewers' sightlines are unpolluted by environmental color, allowing them to worship art wholeheartedly.

📱

Minimalist Interface

From reading apps to Muji's design, black, white, and gray construct the clearest information hierarchy. Without extraneous colors to distract, interaction returns to pure functional essence.

👤

Avant-Garde Fashion

Gray-toned suits with irregular tailoring break the constraints of body curves. Architectural deconstructive designs, through the splicing of different gray-shade fabrics, reshape the sculptural sense of the human body.

📜 Origin & History

Black, white, and gray are not colors but a philosophical inquiry into the origin of light and shadow. In ancient China, the Book of Changes proposed 'Taiji gives rise to the two modes,' where black and white represented Yin and Yang, the duality and unity of heaven, earth, and all things. Gray was the flowing Qi between them. The ancients also said: 'Ink divides into five colors'—burnt, dense, heavy, light, and clear—the infinite variations of gray being a refinement of the world's essence.

When photography was born in the 19th century, daguerreotypes and film stripped the world of color, leaving only grayscale. Black-and-white photos removed the distraction of color, forcing viewers to confront the geometry of light, subjects' expressions, and the emotional core of events. Grayscale at this time represented eternity, truth, and historical gravity, freezing countless unrepeatable decisive moments.

In the early 20th century, Kazimir Malevich's 'Black Square on White Ground' and 'White on White' completely elevated gray to an artistic altar. Suprematism declared the primacy of feeling, using minimalist geometry and gray scales to liberate art from the shackles of depicting the objective world, turning gray into a symbol of spiritual freedom and infinite cosmos.

In graphic design, the Swiss Style (International Style) flourished after WWII. Grid systems, sans-serif fonts, and asymmetrical layouts in black, white, and gray emphasized clarity and objectivity in communication. Black, white, and gray here embodied the democratization of information, using cold rationality to erase individual traces in pursuit of absolute visual order.

Entering modern life, design masters like Yohji Yamamoto and Rei Kawakubo initiated a deconstructivist black storm in fashion. They essentially explore the layered limits between black, white, and gray through tailoring and fabrics. This 'anti-fashion' concept endows gray with an intellectual rebelliousness, representing independence, strength, and a life force that defies established rules.

🧠 Color Psychology

Minimalist and RestrainedRemoving all ornamental visual language, preserving the most unadorned structure. This extreme restraint compels the mind to detach from materialism and return to the authenticity of emptiness.

Philosophy of Light and ShadowAs gray oscillates between the poles of black and white, it displays the trajectory of flowing light. It prompts existential contemplation on light and dark, void and substance, and the transience of life.

Absolutely InclusiveAs the most extreme achromatic system, black, white, and gray seamlessly accept the entire color spectrum. This all-embracing quality symbolizes a broad mind and strong adaptability.

Eternally ClassicZero saturation means it is least affected by time's erosion. Black, white, and gray convey an 'immortal' quality; regardless of changing trends, it is never out of style.

Mysterious and DistantIt's like shrouding objects in a thin mist, creating an unbridgeable psychological distance. In black-and-white imagery, the viewer is both observer and voyeur, filled with mystery.

High-End TextureStripped of color, an object's texture, contour, and light are magnified. Only high-quality materials and craftsmanship dare to undergo the grayscale test, thereby establishing an absolute sense of luxury.

← Back to Explore Colors