Gradient Kit

Composable CSS gradient helpers with normalized color stops.

colormix.dev

gradient-kit serializes linear, radial, and conic CSS gradients from typed stops. Stops are validated, trimmed, and sorted so generated styles stay stable and predictable.

Not published yet. It builds from source in this repository.

Usage

import { linearGradient } from "gradient-kit";

const background = linearGradient(135, [
  { color: "oklch(72% 0.18 250)", position: 0 },
  { color: "oklch(42% 0.2 310)", position: 1 },
]);

API

| Export | Purpose | | --- | --- | | linearGradient | Create a degree-based linear gradient. | | radialGradient | Create a circle or ellipse gradient. | | conicGradient | Create an angle-based conic gradient. | | GradientStop | Type for a CSS color and normalized position. |

Development

npm run build

License

MIT