Gradiente

Gradiente is a lightweight gradient parser and transformer for modern rendering systems.

Parse CSS gradients → work with structured data → render anywhere.

Gradients as data, not strings.

Install

npm install gradiente

Example

import { parse, transformTo } from "gradiente";

const gradient = parse("linear-gradient(red, blue)");

const css = transformTo("css", gradient);
const canvas = transformTo("canvas", gradient);

canvas.draw(ctx, 300, 300);

The full documentation is published on gradiente docs. Some quick entry points:

• Getting started
• API References
• Custom Gradients

What it does

• Parses gradients into structured objects
• Normalizes angles, positions, and stops
• Transforms gradients to different targets:
  • CSS
  • Canvas
  • (more coming)

Built for

• design tools
• visual editors
• canvas engines
• WebGL / Pixi / Konva
• custom rendering pipelines

Philosophy

Gradiente treats gradients as a graphics primitive.

Not a string to preserve - but data you can transform and render anywhere.

Contributing

Contributions of all kinds (feedback, ideas, bug fixes, documentation) are welcome.

Please open a GitHub issue/discussion before putting in any work that’s not straightforward.

More in CONTRIBUTING.md.