465 gradients · Tailwind, CSS3, React
color.xima
Gradients that vibe for modern UI, cards, hero sections, copy-ready CSS, Tailwind classes, and a gradient generator.
Three families, one per row: linear, border, and mesh gradients. Every tile is a real class from the catalog — the same code the generator hands you. Open one to copy it as Tailwind, CSS3, or React.
Sections
Pick one, or generate your own
One catalog feeds everything on the site: the gallery, three generators, curated picks, and the favorites you keep locally.
Gallery
All 465 gradients in one grid, with in-page search and tag filters. Copy Tailwind or CSS3 without leaving the page.
Presets generator
Open any catalog gradient, preview it as a block or as gradient text, and copy Tailwind, CSS3, or React.
Mesh generator
Place your own color points on a canvas and build a custom mesh gradient from scratch.
Instagram post
Frame a gradient at Instagram size, set the padding, and download it as a PNG.
Picks
5 hand-curated sets grouped by the job: hero backgrounds, card accents, buttons, dark UI, pastels.
Favorites
Tap the heart on any gradient while you browse; the set stays in this browser, ready to copy.