Fieldbook is a catalog of original UI components for React, Vue, Svelte, Astro and HTML, made by Lizardi Studio in Mexico City, with an MCP server for coding agents.
Move them, tune them, then take React, Vue, Svelte, Astro or HTML, or hand the plate number to your coding agent.
1,404 components21 categories5,616 tested ports
Every plate is live.
Each one is the real component, running in your browser. Open one to take the code.
Tune the feel.
Pick a curve and feel it on a button, a switch and a card. Many Fieldbook components take duration, speed or easing props, so you can set the feel yourself.
How should it land?
t 0.00 · 900 ms · back-out
linear
ease-in-out
expo-out
back-out
bounce
elastic
back-out
back-out
back-out
One system, six product families.
Buttons, switches, sliders and cards, grouped by what you are building, so you can find the pieces that fit your interface.
Product families
button
1,404 components, ready to install.
Search by what you are building, filter by family, and take React, Vue, Svelte, Astro or HTML.
Categories
Your agent installs it.
Connect the Fieldbook MCP server once. Ask for a plate by number and your agent fetches the component, its props and its ports.
terminal
codex mcp add fieldbook --url https://fieldbook.lizardi.mx/api/mcp --bearer-token-env-var FIELDBOOK_TOKEN
ask
Add FB-2556 to the save button in settings.
fetch
- component source
- props and defaults
- React, Vue, Svelte, Astro, HTML
use
Make it move.
Start with the open components, or go Pro for the full catalog at USD 14.99 per month.
Building something beyond the library?
Work with Lizardi Studio