SonoJS
React components, blocks, and tools for your projects.
A customizable React UI library with ready-to-use components, interface blocks, charts, and icons. Use the SonoJS CLI to add components to your project, or connect an AI coding agent through MCP.
- Reading your project
- Composing with SonoJS components
- Wrote login-form.tsx
Welcome back
Sign in to continue.
Forgot your password?
Blocks for complete AI interfaces
Production-ready blocks for agent workspaces, chat composers, and full product flows — so you can ship real interfaces without starting from a blank canvas.
- Model picker and send controls
- Interactive composers for AI agents
- RTL-ready and theme-aware
- Copy or install with the SonoJS CLI
118+ blocks. Ready to build with.
Charts ready for production
A collection of customizable, interactive charts for React, built for modern dashboards and data-driven applications. Fully RTL-ready, with dark mode and responsive layouts. Easy to customize and install with the SonoJS CLI.
- Full RTL support
- Dark mode and responsive layouts
- Interactive chart demos
- Copy, customize, or install with the SonoJS CLI
221+ charts. Ready to build with.
BitcoinBTC/USD
+0.70%$68,097.84
0.00%Icons for every interface
Explore a growing collection of icons for development, crypto, interfaces, and everyday use. Find the right icon, customize it, and use it directly in your React projects.
- Developer and technology icons
- Crypto and blockchain icons
- UI and general-purpose icons
- Easy to find and use
Tools that simplify your workflow
Practical browser tools for everyday work — call APIs, inspect responses, and clear friction without leaving your tab.

MCP for your AI coding agent
Connect AI coding agents like Cursor and Claude Code to SonoJS through MCP. Let your agent discover components, access documentation, and build interfaces directly in your codebase.
