Light yellow is a soft shade with warm and joyful qualities. Like other yellow hues, it symbolizes peace and sunshine while embodying new beginnings and a sense of freshness.

Light yellow is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #FFFFC5
- RGB value: 100% red, 100% green, and 77.3% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use light yellow in your designs:
- Create a sense of warmth. Light yellow evokes feelings of happiness, optimism, and friendliness. It’s an excellent choice for interfaces like educational websites and apps that need to feel welcoming and inviting.
- Improve readability. When paired with a dark text color, light yellow backgrounds can enhance readability and reduce eye strain for users.
- Accentuate other colors. Light yellow can act as a bright and cheerful accent color, complementing a broader color palette within your design.
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same soft spectrum as light yellow, consider:
- Pastel yellow (#FFEE8C) captures a softness similar to light yellow, creating a gentle, calm experience.
- Cream (#FDFBD4) is a pale yellow, almost off-white hue that offers neutrality next to light yellow’s warmth.
- Peach (#FFD3AC) is a soft pink with yellow undertones that match light yellow’s delicateness.
- Light orange (#FFDBBB) matches the softness of light yellow but leans more orange with a hint of warmth.
To complement light yellow, consider pairing it with:
- Pastel orange (#FFC067) adds a hint of vibrancy when paired with light yellow, creating a warm, inviting experience.
- Pastel green (#80EF80) complements light yellow’s warmth with its refreshing, cool hues.
- Cool gray (#CBCBCB) is a timeless neutral shade that creates a clean, calm contrast.
- Lavender (#D3D3FF) matches the cheerfulness of light yellow to create a tranquil color combination.
Other colors worth considering include navy blue to create a playful contrast, terracotta to add a hint of earthiness, and turquoise for an eye-catching combination.
While light yellow is pale, it may clash with:
- Neon green (#2CFF05) conflicts with the softness of light yellow and can create a jarring visual appearance.
- Mocha (#6D3B07), when paired with light yellow, appears dull.
- Olive green (#636B2F) may look muddy when paired with light yellow due to their close proximity on the color wheel.
- Crimson red (#B22222) creates tension with its deep, cool tones contrasting light yellow's warmth.
- Black (#000000) with light yellow forms a stark contrast, evoking a somber atmosphere.
Light yellow embodies the optimism and joy associated with sunshine. It evokes images of spring meadows, fluffy chicks, and the beginnings of a new day. This pale shade also carries connotations of intellect and mental clarity.
In color psychology, light yellow is a breath of fresh air. It uplifts the mood, sparks creativity, and generates feelings of happiness and peace. The lack of intensity makes it approachable and easy on the eyes, reducing stress and anxiety.
In UI design, light yellow fosters a warm ambiance and serves as a gentle highlight color, capturing attention without overwhelming the user. However, using light yellow by itself may reduce contrast. Pair it with darker colors or text to enhance readability and visual appeal.
Light yellow originates from the primary color yellow, dating back to prehistoric cave paintings when artists used yellow ochre pigments to depict the sun and stars. Also, early association with gold made yellow a sacred color in many cultures.
Before specific names for light yellow hues existed, people described objects based on material, like“saffron-hued” or “ivory-colored.” Light yellow emerged as a distinct color name during the 18th and 19th centuries with the evolution of color theory.
Today, light yellow appears in spring fashion, home decor, and designs for softer elements.
Color variations
Shades
Tints
Tones
Hues
Color Harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom Palettes
Old World
Promenade
Prairie
Contrast 1.03
- Large Text
#FFFFC5
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 20.36
- Large Text
#FFFFC5
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Pass | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #FFFFC5, known as light yellow, has RGB values of R:255 G:255, B:197 and CMYK values of C:0, M:0, Y:0.23, K:0.
| VALUE | CSS | |
|---|---|---|
| HEX | FFFFC5 | #FFFFC5 |
| RGB DECIMAL | 255, 255, 197 | RGB(255,255,197) |
| RGB PERCENTAGE | 100, 100, 77.3 | RGB(100%,100%,77.3%) |
| CMYK | 0, 0, 23, 0 | |
| HSL | 60°, 100, 88.6 | HSL(60°,100%,88.6%) |
| HSV (OR HSB) | 60°, 22.7, 100 | |
| WEB SAFE | FFFFCC | #FFFFCC |
| CIE-LAB | 98.754, -9.016, 27.808 | |
| XYZ | 87.076, 96.812, 66.92 | |
| xyY | 0.347, 0.386, 96.812 | |
| CIE-LCH | 98.754, 29.233, 107.963 | |
| CIE-LUV | 98.754, 2.997, 41.609 | |
| HUNTER-LAB | 98.393, -14.218, 28.55 | |
| BINARY | 11111111, 11111111, 11000101 | |
| iOS - SwiftUI | Color(red: 1, green: 1, blue: 0.773) | |
| iOS - UIKit | UIColor(red: 1, green: 1, blue: 0.773, alpha: 1) | |
| Android - Compose | Color(0xFFFFFFC5) |


