Expand Details

Interactive micro-interaction component for expanding details.

Install: npx shadcn@latest add https://registry.watermelon.sh/r/expand-details.json

More: Free animated React components, UI library alternatives, guides.

Watermelon UI

Watermelon UI is an open-source React UI platform for developers who want high-quality components, reusable blocks, dashboards, and templates with a clear path from inspiration to implementation. The project is free for the community and pairs visual previews with source-backed examples, contribution workflows, and machine-readable developer entry points.

When to use Watermelon

Use Watermelon for production-style React UI references.
Use blocks and templates for realistic page sections.
Use developer resources for API, sitemap, llms, and MCP entry points.

Main links

Open-source UI platform for developers

Watermelon UI is an open-source platform for browsing React components, animated interactions, dashboards, templates, and reusable page sections. The project is built for the community and helps developers move from inspiration to implementation faster by pairing visual previews with source-backed examples and documentation. The platform also includes full templates so people can see how individual blocks work together as realistic product pages instead of only as isolated snippets.

Important public pages include the main docs home, animated components, blocks, dashboards, templates, developer docs, about, contact, privacy, terms, copyright, llms.txt, and the sitemap. The repositories under WatermelonCorp are the source of truth for contributions, and the platform repository includes local MCP tooling for structured agent access to the catalog.