Nocta UI

Nocta UI

Modern react component library

7 followers

A modern, accessible React component library built with simplicity, performance, and developer experience at its core. Copy-paste components with full TypeScript support.
Nocta UI gallery image
Nocta UI gallery image
Nocta UI gallery image
Free
Launch Team
Webflow | AI site builder
Webflow | AI site builder
Start fast. Build right.
Promoted

What do you think? …

Marek Jóźwiak
I built Nocta UI out of pure frustration with existing component libraries. I was trying to add custom GSAP animations to a shadcn/ui accordion component, but hit a wall — the Radix primitives underneath were complete black boxes that I couldn't modify. What makes Nocta UI unique: True source code ownership — Unlike other libraries that use primitives or abstractions, you get the actual React component code in your project. Want to add complex animations? Change state management? Modify accessibility behavior? It's YOUR code. Beautiful design system — 4 carefully crafted color themes (Charcoal, Jade, Copper, Cobalt) with automatic Tailwind integration. The CLI detects your setup and configures everything. Zero bundle bloat — Copy-paste approach means components live in your codebase. No version conflicts, no mysterious dependencies, just clean React components you can understand and modify. Accessibility-first — Every component is WCAG 2.1 AA compliant with keyboard navigation and screen reader support built in from day one. What I'm most proud of: The CLI experience. Run npx nocta-ui init and it automatically detects your framework (Next.js/Vite), validates Tailwind installation, lets you choose a theme, and sets up everything perfectly. Then npx nocta-ui add button copies the component directly to your project. This is the component library I wish existed when I was fighting with that accordion animation. Finally, components that are truly yours to customize!
CaiCai

Actually, I'm curious if there are any plans for AI-related components, because there are just so many other basic components right now.

Marek Jóźwiak

@hi_caicai Hey! The upcoming library development plan will take a different approach: building components using GSAP and Three.js animations based on the existing design system.