Color field pairing a filled swatch with the chosen name and hex code and an eyedropper button.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Input20 } from "@/components/beste/piece/input20";
<Input20
label="Accent color"
hex="#6D5EFA"
name="Mira violet"
/>Dark mono code field with a language eyebrow, line-number gutter, and content lines on a foreground canvas.
Regex field with slash delimiters, flag suffix in amber, and an emerald match-count pill on the right.
File picker with a muted Choose file button on the left and the selected filename and size on the right.
Crypto address field with a gradient Ξ avatar, shortened mono address, and an ENS lookup chip.
Five-star rater with filled amber stars in muted tiles and a decimal rating chip to the right.
Message input that highlights @-mentions in sky and #channel tags in violet amid plain body text.