Accessible components, animated icons, illustrations and themes that move together.
Youj is an open-source React kit. Its components are shadcn/ui on Base UI, re-skinned and accessible by default: keyboard, screen-reader and reduced-motion support, built toward WCAG 2.2 AA and checked with automated tests (not a conformance claim). Its motion system decides how everything moves; its icons are drawn for it. Use it as npm packages, or copy the source into your app.
Four rules behind every part.
One language
Components, motion, icons and illustrations read the same tokens, so one provider sets the theme, the speed and reduced motion for the whole app, portals included.
Precise motion
Motion starts at once, travels fast and stops exactly on its mark. One settle spring, with a single overshoot, is spent on success and arrival.
Accessible by default
Base UI primitives, full keyboard support and AA contrast in every theme. Reduced motion is a designed state that keeps the meaning.
Yours to own
Install the packages and import from them, or copy the source in with the Youj CLI and change anything. The same components either way; the copy-in route needs React 19.
The motion rules, shown side by side with what they avoid: Motion principles.
Everything versions together.
- @youj/reactAccessible components on shadcn/ui and Base UI, plus blocks
- @youj/motionMotion tokens, the provider, primitives, effects, backgrounds and players
- @youj/iconsOriginal animated icons that morph between states
- @youj/illustrationsIsometric scenes and the kit to draw your own
- @youj/soundDesigned interface sounds for the components’ cues, off until you add the provider
- @youj/cliThe CLI: init, add, create, doctor and mcp
- @youj/mcpAn MCP server that gives AI coding tools the docs, props and icons
- Figma kitA plugin that builds the kit in Figma from the same tokens
MIT licensed, built on open work.
Credits explains the projects Youj uses, including Lucide, which the originality test and `YoujIcon` use. The notices file carries their licenses. The brand marks in the icon set belong to their owners and aren’t covered by the MIT license.
- Maintainer
- @louis-henry (GitHub)
- Roadmap
- What’s built and what’s next, without dates: Roadmap
- Security
- Supported versions, reporting and the supply chain: Security policy
Get help.
Everything happens in the open, on GitHub. Search the docs first: most answers are one search away (⌘K or Ctrl K).
- Read the answersCommon questions, answered from the code: license, React, bundle size, theming, accessibility.FAQ
- Report a bugOpen an issue with your versions (
npx @youj/cli doctorprints them) and a small reproduction.Open an issue(GitHub) - Ask a questionQuestions, ideas and show-and-tell go to Discussions, where the answer helps the next person.Start a discussion(GitHub)
- Report a vulnerabilityPlease don’t file a public issue. Report it privately, so it can be fixed before it’s public.Security policy