React components, blocks and templates that animate every change of state, built on Base UI, motion and Tailwind CSS 4, with an MCP server.
The hairline, the open state and the focus halo take the brand colour.
Each plan has a line of detail in the list; the trigger keeps the name.
Some options are shown but cannot be picked.
The picked row ends with the selected mark.
An invalid field with the message that says how to fix it.
The label sits on the top edge of the trigger.
Options gathered under frontend and backend headings.
A line of help under the trigger, read with the field.
A clock icon before the value in the trigger.
Each framework shows its mark, in the list and in the trigger.
Framework marks at the start of the rows, the selected mark at the end.
Members without a photo get a coloured plate with their initial.
The label lives inside the field, above the value.
A dimmed prompt shows until an option is picked.
Two-line rows with an avatar, a name and a handle.
A muted prefix names the setting before its value.
A hairline divides the groups of options.
A one device pixel line.
Section links with a travelling underline, status badges and a power switch.
Lattice Studio settings: a settings rail with a way back to the app, a profile, notifications by channel and the workspace page, each saving through one unsaved-changes bar, with saved names showing in the sidebar at once.
The sidebar switches to a settings rail with a way back to the app, beside a settings page of rows that save as you change them.
Who can open the project as three access levels with a travelling highlight, what the link allows and the link to copy
Share buttons and a link to copy in one click.
A dialog docked to an edge, floating 8px from it.
A slanted glint that sweeps across the border of a card, on a slow loop or once on hover and keyboard focus.
Switches between show more and show less, and turns its chevron.
A workspace sidebar on the window colour with search, quick create and an account menu, and every page in one rounded panel beside it.
A focused Loomboard page: sign in with a one-time code, with links to create an account and to reset a password, all in one card that resizes from one flow to the next.
Email and password with remember me and a reset link.
An email, then a six-digit code, then signed in: the card resizes between steps, the button turns into its working state and a wrong code says what to do next.
A primary sign in joined to a QR code button.
Name, email and password, with Google as the other way in.
Name, email and password with rules that tick as they are met, a reveal button that swaps its eye, and errors that fold away once you type again.
An email field with its label above.
A logo, four links with a highlight that travels to the current one, and two actions.
One file at a time, picked or dropped, shown in a row under the zone.
A split heading above six short items, each led by a key cap icon tile, two of them with their shortcut.
A light placeholder while content loads.
A trail separated by slashes, as in a file path.
One or several thumbs on a thin track.
Low and high written above the two ends of the track.
A slider and a number field that follow each other.
A tall, narrow brand thumb carved out of the surface.
A storage limit with its minimum, middle and maximum below.
A temperature field and slider with a reset that appears once changed.
A thumb filled with the brand colour of the track.
A slider that steps by ten with a softly squared thumb.
Monthly credits set by dragging or by minus and plus buttons.