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

Twenty palettes, plus yours.

Every tile is the same recipe with a different colour set. Sixteen light, four dark, and any of them has a dark twin. Pass a brand hex and it derives one for you.

--palette dawn--palette sorbet--palette glacier--palette dusk--palette meadow--palette ember--palette peach--palette lilac--palette ocean--palette citrus--palette rose--palette sand--palette mint--palette aurora--palette candy--palette slate--palette ink--palette midnight--palette graphite--palette nightfall

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

A responsive page, a CSS block, a React component, an SVG, or PNGs at any size.

hero.html
skin.css
Skin.jsx
og.png