Watermelon UI
Technical, animated landing templates installed through the shadcn CLI
Watermelon UI publishes complete landing page templates and animated components as shadcn registry items, so a whole page arrives as files in your repository rather than a dependency. The house style is dark, monospaced and heavy on crosshairs and hairline rules. This site runs on its landing-01 template.
What you get
Templates are distributed as shadcn registry blocks. Running the CLI writes real component files into your project, which means you edit them directly and never wait for an upstream release to change a paragraph.
The animation work is the reason to look. Section entrances are staggered with Motion, counters run on a viewport trigger, and the decorative SVG visuals animate their path lengths rather than fading a static image in. It is a deliberate style rather than a neutral base.
How it fits a Next.js project
The templates are authored against Vite, so two edits are needed per file after install. Interactive sections need a use client directive at the top, and router links import from react-router-dom rather than next/link.
Both are mechanical changes an agent can make in one pass. Nothing else about the components is framework specific.
Reach for it when
- you want a finished page, not a box of parts
- the product is technical and the audience reads monospace without flinching
- you would rather own the files than track a dependency
Watch out for
- some registry blocks import demo components that are not published with them, so a card or two arrives empty and needs filling
- hero and template sections reference images on the project's own CDN, which you should replace with your own assets rather than hotlink
- the style is strongly opinionated, so a warm consumer brand will fight it
Compare with these
- Landing pagesFree tier
Magic UI
A large catalogue of animated marketing components for React
- animation
- shadcn
- motion
MITRead - Landing pagesFree tier
Aceternity UI
Big, cinematic hero effects with the code shown in full
- animation
- hero
- motion
Free to use, per the project's own termsRead - Landing pagesFree tier
Motion Primitives
Small, composable animation building blocks rather than finished effects
- animation
- motion
- primitives
MITRead