Skip to main content

Using Lemon in design

HEX

#FFF44F

RGB

255, 244, 79

HSL

56°, 100%, 65%

HSV

56°, 69%, 100%

Lemon (#FFF44F) sits in the lively band where yellow picks up a hint of green — like sun through young leaves rather than buttercream. It feels citrus-bright without the electric edge of screen primaries, making it workable for friendly badges, summer campaigns, and fresh-packaging cues.

Best for

Marketing websites, social media graphics, and campaign landing pages.

Accessibility

Check contrast before using lemon for text-heavy layouts, especially on low-contrast backgrounds.

Lemon color swatch — #FFF44F

How does lemon compare to nearby colors?

What is the difference between lemon and saffron?

Lemon (#FFF44F) and Saffron (#F4C430) may look neighboring at first glance, yet their surface character diverges once they sit next to whites, charcoals, and other real layout neutrals. Lemon shifts the system toward paper, tint, and background behavior more than Saffron does. Begin with lemon when the family needs its current undertone and surface character; keep saffron for the nearby alternative that shifts the mood without leaving the same hue neighborhood.

What color is lemon?

Named after the fruit's peel in ideal lighting. Common in confectionery, cleaning-product identities, and illustrations where "fresh" and "zesty" are literal metaphors.

What is the hex code for lemon?

FormatValue
HEX#FFF44F
RGBrgb(255, 244, 79)
HSLhsl(56°, 100%, 65%)
HSV / HSBhsv(56°, 69%, 100%)
CMYK (approx.)cmyk(0%, 4%, 69%, 0%)

Convert Lemon to other color formats

Open the color converter with Lemon (#FFF44F) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.

Convert Lemon in the color converter

What does lemon mean in design?

Lemon may evoke cleanliness, vitality, or mild tartness. Versus canary's warmer push, lemon often feels cooler and more green-yellow; versus dandelion, it tends to scan slightly cleaner and less earthy.

How do I use lemon in code?

CSS (hex)color: #FFF44F;
CSS (rgb)color: rgb(255, 244, 79);
CSS (hsl)color: hsl(56, 100%, 65%);
RGB %rgb(100%, 96%, 31%)
Tailwindtext-[#FFF44F]
SwiftUIColor(red: 1.000, green: 0.957, blue: 0.310)
UIKitUIColor(red: 1.000, green: 0.957, blue: 0.310, alpha: 1.0)
AndroidColor.rgb(255, 244, 79)
ComposeColor(0xFFFFF44F)
Web Safe#FFFF66

Is lemon accessible?

CombinationRatioAAAA lgAAAAAA lgUI
AaWhite text on this color1.15:1
AaBlack text on this color18.31:1
AaThis color as text on white1.15:1
AaThis color as text on black18.31:1

WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.

How does lemon look with color blindness?

Normal vision#FFF44F
Protanopia (red-blind)#FAFA77
Deuteranopia (green-blind)#FBFC81
Tritanopia (blue-blind)#FE969D
Achromatopsia (total color blindness)#EAEAEA

Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.

What colors go with lemon

#36454F
Charcoal

Charcoal lets lemon stay light and atmospheric while still giving the layout a readable dark value for text and hierarchy.

#000080
Navy Blue

Navy blue makes lemon easier to control on slides, charts, and marketing surfaces where yellows otherwise run hot.

#FFFDD0
Cream

Cream takes the hard digital edge off lemon and makes the color feel more printed, paper-backed, and approachable.

#FFFFFF
White

White keeps lemon poster-clean instead of crowded, which is especially useful when the color already arrives with a strong screen presence.

#800020
Burgundy

Burgundy sits far enough away from lemon in lightness that the pair reads cleanly at presentation distance instead of collapsing into one band.

What colors clash with lemon

#39FF14
Neon Green

With lemon, Neon Green pushes the work toward novelty or screen-effect territory faster than most brand or editorial systems can tolerate.

#FF00FF
Magenta

Magenta pushes lemon toward a nightclub or cosmetic register that is hard to square with calmer editorial or product work.

#00FFFF
Cyan

Cyan redirects lemon toward a more technical, backlit interpretation, which is risky when the goal is warmth, polish, or print-minded editorial work.

#D3D3D3
Light Gray

Light Gray is gentle enough that lemon loses some of its structure beside it; the pair can feel underbuilt rather than intentionally quiet.

How should I use lemon in design?

  • Lemon works as a primary accent or highlight color — bright enough to draw attention but check contrast carefully if using it for text on white backgrounds.
  • Cool neutrals like charcoal and slate sharpen lemon's warm character, while warm companions like cream and gold amplify its inviting quality.
  • Vivid colors like lemon work best as punctuation in a layout: CTAs, key metrics, or a single hero element. Surrounding neutrals keep it from fatiguing the viewer.

What are good lemon palettes?

Light touch

Marketing websites, social media graphics, and campaign landing pages.

Warm hearth

One-pagers, brochures, and lifestyle brand packaging.

Accent framework

Email templates, blog headers, and content marketing visuals.

Design with lemon in Moda

Create a presentation or document using lemon as your accent color. Moda's AI applies your color palette automatically.

Create a design with lemon

What are the shades and tints of lemon?

Shades (darker)

Tints (lighter)

Tones (desaturated)

Hue variations

What are the color harmonies for lemon?

Harmonies are calculated from the base swatch. When a harmony matches a named color page, it links there; otherwise it appears here as a computed reference swatch.

Complementary
Blue#4D58FFComputed
Analogous
Green#B2FF4DComputedOrange#FF9A4DComputed
Triadic
Cyan#4DFFF3ComputedPurple#F34DFFComputed
Split-complementary
Cyan#4DB2FFComputedBlue#9A4DFFComputed
Monochromatic
Dark Yellow#665F00ComputedYellow#CCBE00ComputedYellow#FFF133ComputedLight Yellow#FFF899Computed
Square
Green#4DFF9AComputedBlue#4D58FFComputedPurple#FF4DB2Computed

Frequently asked questions

What is the hex code for lemon?

The hex code for lemon is #FFF44F. In RGB, that's 255 red, 244 green, and 79 blue. The approximate CMYK equivalent is 0% cyan, 4% magenta, 69% yellow, and 0% key (black).

Is lemon a warm or cool color?

Lemon reads as warm. It feels most natural with creams, golds, rusts, and other warm accents, while cooler partners like navy or teal create sharper contrast.

Is lemon better as an accent or a full-palette color?

Lemon is usually best when it leads in short bursts rather than covering everything. It can headline a palette, but most layouts work better when the color handles accents, highlights, or one main hero role instead of every surface.

How should I use lemon in a design?

Lemon is vivid enough to work best in controlled doses such as CTAs, highlighted metrics, chart accents, or a single hero element. Surround it with quieter neutrals so it does not exhaust the layout.

Can I use lemon for text or backgrounds?

Lemon works better with dark text than white text. Black text reaches 18.31:1 contrast on the swatch, which makes the color more usable as a background or highlight surface than as a dark panel.

Last updated April 6, 2026

Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.