Guides
How to build the parts of a product people use every day, with working code and live examples. Each guide uses Arc components, and the ideas carry over to any React codebase.
Build a SaaS dashboard with React and Arc
Lay out a product dashboard with a sidebar, animated stats, a sortable table and an activity timeline, then keep it fast and readable as data changes.
Animate React interfaces with Motion the right way
When to animate, which spring to reach for, how to keep motion interruptible, and how to build a reduced motion branch that still gives feedback.
Use shadcn registries with AI coding tools
Connect Claude Code, Cursor and Codex to a shadcn registry and an MCP server so your agent installs real components instead of guessing markup.
Build a polished React settings page
Structure settings people can scan, save changes without surprises, and handle the destructive actions at the bottom of the page.
Create onboarding flows that people finish
Ask for less up front, show progress honestly, and let people skip, resume and finish setup on their own schedule.
Build a command menu in React
Open it with Cmd K, filter as people type, group results, drive it from the keyboard, and keep it instant for the hundredth use of the day.
Best React component libraries in 2026
Compare shadcn/ui, Magic UI, Aceternity UI, React Bits, HeroUI, Mantine, MUI, 21st.dev and Arc, with licenses, stacks and when to pick each.
Best UI library for Claude Code and Cursor
What makes a React UI library work well with Claude Code and Cursor: a registry, an MCP server, llms.txt, markdown docs and typed props. Plus setup steps.