btn-rotating-gradient
ui-layouts/btn-rotating-gradientFreeComponent
ui-layouts publishes no description for this item.
Install it
npx shadcn@latest add https://www.ui-layouts.com/r/btn-rotating-gradient.jsonSource
1'use client';23const ButtonRotatingGradient = () => {4 return (5 <button className='relative inline-flex h-12 overflow-hidden rounded-full p-[2px] focus:outline-hidden focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2 focus:ring-offset-neutral-50'>6 <span className='absolute inset-[-1000%] animate-[spin_2s_linear_infinite] bg-[conic-gradient(from_90deg_at_50%_50%,#a2aeff_0%,#3749be_50%,#a2aeff_100%)] dark:bg-[conic-gradient(from_90deg_at_50%_50%,#E2CBFF_0%,#393BB2_50%,#E2CBFF_100%)]' />7 <span className='inline-flex h-full w-full cursor-pointer items-center justify-center rounded-full dark:bg-[#070e41] bg-[#ffffff] px-8 py-1 text-sm font-medium dark:text-neutral-50 text-black backdrop-blur-3xl'>8 Click Me9 </span>10 </button>11 );12};1314export default ButtonRotatingGradient;
Files it writes
More from ui-layouts
All 1 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| 3d-marquee3d-marquee | ui-layouts | Components | Free | no deps · 2 files | |
| accordionaccordion | ui-layouts | Components | Free | no deps | |
| align-slideralign-slider | ui-layouts | Components | Free | 6 deps · 2 files | |
| animal-imagemaskinganimal-imagemasking | ui-layouts | Components | Free | 1 dep | |
| animated-beamanimated-beam | ui-layouts | Components | Free | no deps | |
| animated-beam-bidirectionalanimated-beam-bidirectional | ui-layouts | Components | Free | no deps | |
| animated-beam-defaultanimated-beam-default | ui-layouts | Components | Free | no deps | |
| animated-beam-multiple-inputanimated-beam-multiple-input | ui-layouts | Components | Free | no deps |
