What is Nyx?
A premium, copy-paste library for React and Tailwind. Motion-heavy components, marketing blocks, animated backgrounds, and full page templates, all built to a single standard of craft.
Every piece in the catalog shares the same design language. A bento grid, an animated input, a cursor trail, and a whole template all come from one place, so anything you pull looks like it belongs beside the rest.
It is copy-paste, and it is yours. Nothing to install, nothing wrapping your app. You bring the source into your project and work with plain React, Tailwind, and a few primitives you already know. Read it, change it, keep it.
The free components install straight from the shadcn registry. No account, no wrapper:
What's inside
Four kinds of building block, one system.
- Components
- The interactive, animated pieces you build screens from. Buttons, cards, cursor effects, OTP flows, and notification primitives, each one animated and ready to drop straight into a project.
- Blocks
- Full marketing sections: heroes, bento grids, pricing, footers, navigation, testimonials, and auth. The drop-in parts of a landing or product page.
- Backgrounds
- Full-bleed animated backdrops — bubble fields, grain, matrix rain, ripple effects — dropped behind a hero or section in a single component.
- Templates
- Complete, multi-section pages, fully wired and responsive, for when you want a finished starting point to customize rather than a single part to assemble.
Philosophy
Nyx is opinionated on purpose. Motion is treated as a first-class part of the design, not a sprinkle on top. The restraint everywhere else — typography, spacing, contrast — is what lets hundreds of independent pieces read as the work of one hand.
- Craft over ornament. Confident type and deliberate whitespace carry the design. No fake dashboards, no filler to look busy.
- Motion as language. Interactions are designed, not tacked on. Springs over easings, attention guided not demanded, every animation earning its frame.
- Primitive-light. Plain markup, Tailwind, a little Motion, and icons. Libraries only where a component genuinely needs them, so there is less to paste in and less to maintain.
- You own the code. You copy real source, not an import. Once it is in your project it is yours to edit, restyle, or strip down.
- Written for real products. Responsive, accessible, and dark-mode ready, written the way you would write it by hand rather than as a demo.
Pro unlocks the full catalog for one flat purchase — $129 / year or $149 once, lifetime — with access to everything that gets added later. The library keeps growing under the same licence.
FAQ
What do I get with Nyx Pro?
The full catalog: every block, component, background, and template, plus lifetime access to everything added after you buy on the lifetime plan. Both options are a single one-time or yearly purchase, not a metered subscription.
Are there free components?
Yes. A good portion of the components are free and open, installable straight from the shadcn CLI. Pro unlocks the rest of the catalog and the full page templates.
Do you offer refunds?
No. Nyx Pro is a digital product and all purchases are final and non-refundable. Browse the free components first to get a feel for the code and the craft before you buy.
Can I use Nyx Pro in client projects?
Yes, in unlimited personal and client projects. You own the code you copy and never need to credit Nyx.
Can I redistribute or resell it?
No. Redistributing, reselling, or sharing Nyx Pro source is strictly prohibited, even with modifications. The licence covers use in your own and client projects only.
Is it suitable for teams or agencies?
Yes, but the licence is per developer. Each person who works with Nyx Pro needs their own copy; sharing one purchase across a team is not allowed.