A
Anonymous

Device Repair - Copy this React, Tailwind Component to your project

Improve the component selected by making more detailed and use the faint reddish color in "@tailwind base; @tailwind components; @tailwind utilities; @layer base { :root { --background: 0 100% 98%; --foreground: 0 10% 10%; --card: 0 100% 98%; --card-foreground: 0 10% 10%; --popover: 0 100% 98%; --popover-foreground: 0 10% 10%; --primary: 0 80% 50%; --primary-foreground: 0 100% 98%; --secondary: 0 20% 90%; --secondary-foreground: 0 10% 10%; --muted: 0 20% 90%; --muted-foreground: 0 10% 30%; --accent: 0 20% 90%; --accent-foreground: 0 10% 10%; --destructive: 0 100% 50%; --destructive-foreground: 0 100% 98%; --border: 0 20% 85%; --input: 0 20% 85%; --ring: 0 80% 50%; --radius: 0.5rem; } .dark { --background: 0 10% 10%; --foreground: 0 100% 98%; --card: 0 10% 10%; --card-foreground: 0 100% 98%; --popover: 0 10% 10%; --popover-foreground: 0 100% 98%; --primary: 0 80% 50%; --primary-foreground: 0 100% 98%; --secondary: 0 20% 20%; --secondary-foreground: 0 100% 98%; --muted: 0 20% 20%; --muted-foreground: 0 10% 70%; --accent: 0 20% 20%; --accent-foreground: 0 100% 98%; --destructive: 0 100% 50%; --destructive-foreground: 0 100% 98%; --border: 0 20% 30%; --input: 0 20% 30%; --ring: 0 80% 50%; } } @layer base { * { @apply border-border; } body { @apply bg-background text-foreground; } }" also I need it to use nextjs and shadcn

Prompt
Component Preview

About

DeviceRepair - Comprehensive device repair services for routers, switches, and more, built with React and Tailwind. View and copy code!

Share

Last updated 1 month ago