Frontend & CSS

Color Palette Generator

Create coordinated shades from a base color.

Controls

Base color

#fef0e6
#fddcc3
#fcb583
#fa8f42
#f96b06
#c75605
#954004
#632b03

Choose a base color to generate coordinated light-to-dark shades. Click a swatch to copy its HEX value.

Start with #f97316 to create a warm orange scale.

Design linear or radial gradients and copy the CSS.

Tune shadows visually and copy the CSS.

Set each corner radius with a live preview.