About this piece
Tick Slider
Labeled-tick slider with a primary fill, a value pill in the header, and the active tick bolded.
Usage
The import and the props worth knowing about, in one place.
import { Form25 } from "@/components/beste/piece/form25";
<Form25
label="Tone of voice"
ticks={[
"Formal",
"Neutral",
"Friendly",
"Playful"
]}
tickIndex={2}
value="Friendly"
/>More Form pieces
View all Form16
1224
Stepped Slider
Font-size slider with discrete tick dots under the rail and a mono value chip in the header.
Mira & Co.
Shown on invoices and in the team directory.Labeled Input
Standard text field with a label on top and a muted helper line under the control.
mira@beste.co
Floating Label
Focused input with the label shrunk to the top-left corner and a blinking caret after the value.
Segmented Control
Pill-grouped segmented control with inset muted track and a raised card under the active choice.
