btn-black-shadow
ui-layouts/btn-black-shadowFreeComponent
ui-layouts publishes no description for this item.
Install it
npx shadcn@latest add https://www.ui-layouts.com/r/btn-black-shadow.jsonSource
1'use client';23const ButtonBlackShadow = () => {4 return (5 <>6 <button className='group h-8 select-none rounded-lg dark:bg-black dark:text-white bg-white dark:bg-linear-to-b dark:from-zinc-800 dark:via-zinc-900 dark:to-zinc-600 px-3 text-sm leading-8 text-zinc-950 shadow-[0_-1px_0_0px_#d4d4d8_inset,0_0_0_1px_#f4f4f5_inset,0_0.5px_0_1.5px_#fff_inset] dark:shadow-[0_-1px_0_1px_rgba(0,0,0,0.8)_inset,0_0_0_1px_rgb(9_9_11)_inset,0_0.5px_0_1.5px_#71717a_inset] hover:bg-zinc-50 hover:via-zinc-900 hover:to-zinc-800 active:shadow-[-1px_0px_1px_0px_#e4e4e7_inset,1px_0px_1px_0px_#e4e4e7_inset,0px_0.125rem_1px_0px_#d4d4d8_inset] dark:hover:bg-linear-to-b dark:hover:from-zinc-900 dark:hover:via-zinc-900 dark:hover:to-zinc-700 dark:active:shadow-[0_3px_0_0_rgba(0,0,0)_inset]'>7 <span className='block group-active:transform-[translate3d(0,1px,0)]'>Click me</span>8 </button>9 </>10 );11};1213export default ButtonBlackShadow;
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 |
