%% generate tags start %%
#software-engineering
%% generate tags end %%
![[Pasted image 20230817090007.png | banner ]]
#software-engineering/react
## Whatamesh
how to use it : [whatamesh](https://whatamesh.vercel.app/)
example website: [Liftoff – AI Mock Interview Simulator – Vercel](https://vercel.com/templates/next.js/liftoff)
1. Create a `Gradient.js` file somewhere in your project and add [this](https://gist.github.com/jordienr/64bcf75f8b08641f205bd6a1a0d4ce1d) inside
2. Add the following code to your project:
```
<canvas id="gradient-canvas" data-transition-in />
```
```css
#gradient-canvas {
width:100%;
height:100%;
--gradient-color-1: #53DF83;
--gradient-color-2: #47D2E9;
--gradient-color-3: #3F3F3F;
--gradient-color-4: #EEEEEE;
}
```
```js
import { Gradient } from './Gradient.js'
// Create your instance
const gradient = new Gradient()
// Call `initGradient` with the selector to your canvas
gradient.initGradient('#gradient-canvas')
```