A Grid Backgroud
import { ClassValue, clsx } from "clsx"
import { twMerge } from "tailwind-merge"
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}
| Prop | Type | Description |
|---|---|---|
| width | number | Grid width. |
| height | number | Grid height. |
| size | number | Grid size. |
| children | React.ReactNode | The content of the Grid. |
| className | string | Additional classes for the Grid. |
| contentClassName | string | Additional classes for the Grid contentClassName. |
| gradient | boolean | Whether to show the gradient or not |
| gradientWidth | number | string | The width of the gradient on either side |
export function GridDemo() {
return (
<InteractiveGrid gradient={false}>
<div className="w-[400px] h-[200px] border rounded-md" />
</InteractiveGrid>
)
}