Serial Input

ID-style mono input with a leading hash, wide letter spacing, and a muted Auto-generated pill.

INV-2026-00421Auto

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Input29 } from "@/components/beste/piece/input29";

<Input29
  label="Invoice number"
  value="INV-2026-00421"
/>

More Input pieces

View all Input
typescript
12
const answer = 42;return answer * 2;

Code Input

input25

Dark mono code field with a language eyebrow, line-number gutter, and content lines on a foreground canvas.

$12,480.00USD

Money field with a leading currency symbol, right-aligned mono amount, and a unit label.

design tokens

Pill-shaped search input with a leading magnifier and an inline pill-shaped clear when there is a value.

Ξ
0x4A81…6fA0ENS
Ethereum · Mainnet

Crypto address field with a gradient Ξ avatar, shortened mono address, and an ENS lookup chip.

/^[a-z]+@beste\.co$/gi42

Regex field with slash delimiters, flag suffix in amber, and an emerald match-count pill on the right.

09:30
AMPM

Time Input

input16

Time control with hour and minute tiles separated by a colon, plus a small AM or PM segmented toggle.