shadcn index

Gradient Background Demo

PreviousNext

Demo showing a gradient background.

Docs
animate-uiui

Preview

Loading preview…
registry/demo/components/backgrounds/gradient/index.tsx
import { GradientBackground } from '@/components/animate-ui/components/backgrounds/gradient';

export const GradientBackgroundDemo = () => {
  return (
    <GradientBackground className="absolute inset-0 flex items-center justify-center rounded-xl" />
  );
};

Installation

npx shadcn@latest add @animate-ui/demo-components-backgrounds-gradient

Usage

import { DemoComponentsBackgroundsGradient } from "@/components/ui/demo-components-backgrounds-gradient"
<DemoComponentsBackgroundsGradient />