Docs
Neon Gradient Card
Neon Gradient Card
A beautiful neon card effect
Neon Gradient Card
Installation
npx nyxbui@latest add neon-gradient-card
Add the following animations to your tailwind.config.ts file:
// tailwind.config.ts
module.exports = {
theme: {
extend: {
animation: {
backgroundPositionSpin:
"background-position-spin 3000ms infinite alternate",
},
keyframes: {
"background-position-spin": {
"0%": { backgroundPosition: "top center" },
"100%": { backgroundPosition: "bottom center" },
},
},
},
},
};
Props
Prop | Type | Description | Default |
---|---|---|---|
className | string | The class name to be applied to the component | - |
children | ReactNode | Children elements | - |
borderSize | number | The size of the border | 5 |
borderRadius | number | The size of the radius | 20 |
neonColors | object | The colors of the neon gradient | { firstColor: "#ff00aa", secondColor: "#00FFF1" } |