Nostalgic UI Builder Theme

Soft Scan Blue
#d1eefc
Punchcard Coral
#ffc1a1
Syntax Paper
#fffff0
Highlight Periwinkle
#ced4ff
Dialog Pink
#ffd6dc
Click Gray
#2a2a2a

The palette consists of Light, Dark colors. Accent colors Syntax Paper #fffff0 and Highlight Periwinkle #ced4ff. Palette has Cool, Warm, Neutral colors temperature.

By lightness, this palette runs from #2A2A2A (darkest) to #FFFFF0 (lightest). The lightness range is wide.

Overall saturation feels vivid (higher chroma).

Some hue pairs sit near complementary positions — you may read this as complementary contrast (loose heuristic).

Overall temperature among swatches leans cool.

HEX codes (sorted): #2A2A2A, #CED4FF, #D1EEFC, #FFC1A1, #FFD6DC, #FFFFF0

Palette Nostalgic UI Builder Theme has combination of 6 codes colors:

HEX: #d1eefc, RGB: (209, 238, 252); HEX: #ffc1a1, RGB: (255, 193, 161); HEX: #fffff0, RGB: (255, 255, 240)

HEX: #ced4ff, RGB: (206, 212, 255); HEX: #ffd6dc, RGB: (255, 214, 220); HEX: #2a2a2a, RGB: (42, 42, 42)

Simplified version of palette colors

Shade of lightblue, Tint of peachpuff, Tint of lavender, Tint of mistyrose, Shade of Black

Color scheme was created by hex

More palettes with:

Colors codes in palette

Nostalgic UI Builder Theme color codes HEX, RGB information in table

Color	HEX	RGB	Name	Alternative name
#d1eefc	#d1eefc	RGB(209, 238, 252)	Soft Scan Blue	—
#ffc1a1	#ffc1a1	RGB(255, 193, 161)	Punchcard Coral	—
#fffff0	#fffff0	RGB(255, 255, 240)	Syntax Paper	Ivory
#ced4ff	#ced4ff	RGB(206, 212, 255)	Highlight Periwinkle	—
#ffd6dc	#ffd6dc	RGB(255, 214, 220)	Dialog Pink	—
#2a2a2a	#2a2a2a	RGB(42, 42, 42)	Click Gray	The End

Color Palette Contrast

10 color pairs have low contrast and need improvement which may impact readability.

Text Color	Background Color	Contrast Ratio
#d1eefc	#ffc1a1	1.29
#d1eefc	#fffff0	1.19
#d1eefc	#ced4ff	1.19
#d1eefc	#ffd6dc	1.09
#ffc1a1	#fffff0	1.55
#ffc1a1	#ced4ff	1.08

Image palette Nostalgic UI Builder Theme png

--color-soft-scan-blue:	#d1eefc;
--color-punchcard-coral:	#ffc1a1;
--color-syntax-paper:	#fffff0;
--color-highlight-periwinkle:	#ced4ff;
--color-dialog-pink:	#ffd6dc;
--color-click-gray:	#2a2a2a;

$color-soft-scan-blue:	#d1eefc;
$color-punchcard-coral:	#ffc1a1;
$color-syntax-paper:	#fffff0;
$color-highlight-periwinkle:	#ced4ff;
$color-dialog-pink:	#ffd6dc;
$color-click-gray:	#2a2a2a;

@color-soft-scan-blue:	#d1eefc;
@color-punchcard-coral:	#ffc1a1;
@color-syntax-paper:	#fffff0;
@color-highlight-periwinkle:	#ced4ff;
@color-dialog-pink:	#ffd6dc;
@color-click-gray:	#2a2a2a;