whatamesh

Easily create mesh gradients like Stripe.
195,527 137
Install
npm install whatamesh
Latest Version:0.2.0
Vue:3
Last Updated:Aug 20, 2024
Links: GitHub  ·  npm
Maintainer: jordienric

Whatamesh

Easily create mesh gradients like Stripe.

This project wouldn't be possible without stripe and https://kevinhufnagl.com/

Live Demo

https://whatamesh.vercel.app/

Getting started

Creating your first gradient

<canvas id="gradient-canvas"></canvas>
import { Gradient } from "whatamesh";

const gradient = new Gradient();
gradient.initGradient("#gradient-canvas");
#gradient-canvas {
  width: 100%;
  height: 100%;
  --gradient-color-1: #449ce4;
  --gradient-color-2: #2f8bc1;
  --gradient-color-3: #ccbeee;
  --gradient-color-4: #4c57f6;
}

Version History

Version Released Vue License
0.2.0 ^3.2.6
0.0.1 ^3.2.6