Nexu Design
https://github.com/nexu-io/design- Category
- Developer Tools
- Rank
- No. 2079Tools index
Previous survey · No. 2041 ·
- Pricing
- Open Source
- Type
- TOOL
- Builder
- nexu-io
- GitHub
- 12 stars
- Date
About
Nexu design system and prototypes.
What it does
Nexu Design is a React component system with shared visual tokens, interactive documentation, and desktop and browser demos. Teams consume its public UI and token packages, compose primitives into larger patterns, and use Tailwind utilities for page layout and limited customization.
Why it's ranked here
The repository shows a serious internal platform rather than a loose component gallery. It combines a broad export surface, typed token metadata, documented API constraints, co-located tests, release checks, and coordinated package publishing. Its strongest fit remains teams already committed to React, TypeScript, Tailwind, and pnpm.
What's good
The component library covers foundational controls, navigation, data display, messaging, attachments, and reusable page patterns. Token metadata includes colors, spacing, typography, motion, surfaces, borders, themes, and stacking levels. Clear rules separate generic primitives, composed patterns, and business features. Release validation combines builds, type checks, tests, and package dry runs.
Tradeoffs
This is a workspace, not a standalone visual design application. Adoption assumes React, TypeScript, Tailwind-oriented styling, pnpm, and a modern Node environment. Product copy defaults to hardcoded English unless a surface explicitly supports localization. The detailed design guidance also reflects Nexu-specific layout and interaction conventions that other teams may need to adapt.
How to use it well
Use it for React products that need consistent controls, semantic tokens, documented composition rules, and shared web or desktop demonstrations. Start with the token and UI packages, validate components in Storybook, and keep page layout in Tailwind. It does not replace a design editor, user research process, or general application framework.
Technical notes+
README.md describes a pnpm workspace containing publishable token and React UI packages plus Storybook and Electron apps. packages/ui-web/src/index.ts exposes a large barrel of primitives and patterns. packages/ui-web/vitest.config.ts runs co-located TypeScript and TSX tests in jsdom with CSS enabled. packages/tokens/src/token-data.ts defines typed token categories, brand presets, light and dark theme variables, and exported metadata collections; packages/tokens/src/index.ts re-exports that surface. packages/tokens/scripts/generate-styles.mjs reads the token source, generates theme blocks and Tailwind mappings, and writes package CSS. package.json coordinates recursive checks, builds, packaging validation, and Changesets release commands. docs/release-flow.md documents linked public versions and trusted npm publishing.
Observed
- Primary language
- TypeScript and React source, with JavaScript modules for build scripts
- Packaging
- pnpm workspace with two public npm packages: @nexu-design/tokens and @nexu-design/ui-web
- Interface
- React component library and shared token package
- Development surfaces
- Storybook documentation app plus Electron and browser demo applications
- Testing
- Vitest with jsdom; UI tests are co-located with source files
- Platform requirements
- pnpm-based workspace using Node.js, with the root manifest requiring Node 24.15.0
- Release process
- Changesets coordinates linked package versions, validation, and npm publishing
Read from README.md, package.json, packages/ui-web/vitest.config.ts, packages/tokens/src/index.ts, packages/ui-web/src/index.ts, packages/demo-pages/src/index.ts, packages/tokens/src/token-data.ts, packages/demo-pages/src/vite-env.d.ts, packages/tokens/scripts/generate-styles.mjs, docs/release-flow.md, docs/copy-and-localization.md, docs/component-api-guidelines.md, docs/core-component-api-specs.md, docs/design-system-guidelines.md, docs/cloud-demo-migration-plan.md.
What it can do
Create design system components
Design specifications and requirements → Reusable UI components
Build interactive prototypes
Design layouts and user flows → Clickable prototype
Generate design tokens
Brand guidelines and style preferences → Standardized design tokens (colors, typography, spacing)
Export design assets
Design components and prototypes → Asset files (PNG, SVG, CSS, etc.)
Maintain component library
Updated design components → Organized component library
Tags
Tech Stack
Comments (0)
No comments yet
Editorially curated, with community endorsements as a secondary signal. Corrections welcome.