#F7F1CA
#F7E3C4
#B7D5E8
#84B8E3

Spring Ruby Light

Spring Ruby Light is a balanced warm and cool soft contrast palette built with yellow, orange, blue tones. Copy the HEX codes, download the palette image, save it to your collection, or open related palettes below.

Image Link Copy
#F7F1CA
Yellow
#F7E3C4
Orange
#B7D5E8
Blue
#84B8E3
Blue
MoodColor moodA palette built from its color balance.
ContrastSoft contrastHelps decide how to use text, buttons, and backgrounds.
Main tonesyellow, orange, blueThe strongest color families in this palette.
Best fitDesign useUseful for web, brand, and social layouts.

Related Palettes

#FFFF79
#FFD2DC
#56D5CC
#FF8D08
Spring Beach Wave Colorway
Link CopyImage
#88F5A1
#5FD4A1
#54D1F8
#FFFBB8
Spring Fresh Story Colorway
Link CopyImage
#FFEDBC
#FFDEAD
#C9FFAC
#C0FAEE
Spring Bloom Palette Colorway
Link CopyImage
#FF0876
#FFC613
#428EFF
#0EDEA8
Spring Rust Mood Colorway
Link CopyImage
#FF8758
#FFBF0B
#78E808
#36CCBE
Spring Olive Horizon Colorway
Link CopyImage
#FFBF0B
#FFD96E
#FF8D08
#5ABF90
Spring Emerald Splash Colorway
Link CopyImage
#FFFFDA
#FFF3D4
#C7E5F8
#94C8F3
Spring Ruby Dream Colorway
Link CopyImage
#8CB981
#AAD393
#CFF2C3
#F0FDC5
Spring Frost Vista Colorway
Link CopyImage
#FDFC75
#FFCED8
#52D1C8
#FF8904
Spring Maple Glow Colorway
Link CopyImage
#84F19D
#5BD09D
#50CDF4
#FFF7B4
Spring Autumn Journal Colorway
Link CopyImage
#FFE9B8
#FFDAA9
#C5FFA8
#BCF6EA
Spring Winter Whisper Colorway
Link CopyImage
#FF0472
#FFC20F
#3E8AFF
#0ADAA4
Spring Spring Waltz Colorway
Link CopyImage

Use this palette for

Pairing tips

Background

Use #84B8E3 for soft sections, cards, or open space.

Text and headings

Use #F7E3C4 or a deeper nearby shade for readable type.

Accent color

Use #B7D5E8 for buttons, labels, icons, or small highlights.

CSS variables

:root {
  --palette-color-1: #F7F1CA;
  --palette-color-2: #F7E3C4;
  --palette-color-3: #B7D5E8;
  --palette-color-4: #84B8E3;
}

Spring Ruby Light colour names and contrast

Every value on this page is calculated from this palette's own HEX codes. The closest CSS named colour tells you what to call each shade, relative luminance shows how light or dark it truly is, and the contrast table shows which pairs are safe to set text in.

Swatch reference

SwatchClosest named colourMatchLuminanceHue
#F7F1CABlanched Almond17 RGB pts0.86952°
#F7E3C4Bisque11 RGB pts0.78736°
#B7D5E8Light Blue16 RGB pts0.635203°
#84B8E3Sky Blue46 RGB pts0.447207°

Contrast ratios (WCAG 2.1)

Colour pairRatioBody textLarge text
#F7F1CA on #84B8E31.85:1failfail
#F7E3C4 on #84B8E31.68:1failfail
#B7D5E8 on #84B8E31.38:1failfail
#F7F1CA on #B7D5E81.34:1failfail
#F7E3C4 on #B7D5E81.22:1failfail
#F7F1CA on #F7E3C41.10:1failfail

What this means in practice

FAQ

What type of palette is Spring Ruby Light?

It is a balanced warm and cool soft contrast color palette with yellow, orange, blue tones.

Can this palette work for websites?

Yes. Use the lightest color for backgrounds, deeper colors for text, and mid tones for buttons or accents. Check the contrast table above before setting body copy.

Can I copy the HEX colors?

Yes. Use the copy buttons for the full palette or for a single color row.

Copied