gradient.skin
Claude Code skill

Not that
gradient.

The blue-to-pink one every AI reaches for. One prompt swaps it for soft light on paper. HTML, CSS, SVG or PNG.

Open source · MIT · gradient.skin
gradient.skin
Claude Code skill

Not that
gradient.

The blue-to-pink one every AI reaches for. One prompt swaps it for soft light on paper. HTML, CSS, SVG or PNG.

Open source · MIT · gradient.skin
BeforeAfter · one prompt

Seven palettes, plus yours.

Every tile below is the same CSS recipe with a different colour set. Pass a brand hex and gradient.skin derives the eighth.

--palette dawn--palette sorbet--palette glacier--palette dusk--palette meadow--palette ember--palette ink

Three steps.

A folder with a SKILL.md and a Python script. No packages, no build. Prefer files? Download the .skill or grab it on GitHub.

1. Install

One line. Puts the skill in your Claude Code skills folder.

curl -fsSL gradient.skin/install | sh

2. Ask

Describe the hero. Mention a palette, a brand colour, or nothing.

/gradient-skin launch hero,
palette meadow, animated,
export OG + X images

3. Ship

Get a responsive page, a CSS block for your codebase, an SVG, or PNGs.

hero.html
skin.css
og.png
hero-x.png