Vue 3 · MIT · OSS

Build product UI on a foundation you control.

Nubisco UI is the component library and token engine behind every product we ship. Production-tested primitives, a geometry-first grid, and SCSS design tokens you can theme without forking.

View documentationView on GitHub
Placeholder: screenshot of the Nubisco UI documentation site showing component preview, code snippet, and design-token panel side by side

Install

Two lines of setup.

Add the package, register the styles, and start composing. No CSS-in-JS runtime, no framework lock-in beyond Vue 3.

pnpm add @nubisco/ui
import '@nubisco/ui/styles'

Why Nubisco UI

Primitives, not a closed kit.

  • Tree-shakeable by default

    Import only what you use. Each component ships as its own ES module with explicit dependencies.

  • SCSS token engine

    Spacing, colour, typography, motion, and breakpoints exposed as CSS custom properties. Theme by overriding, not by forking.

  • Geometry-first grid

    NbGrid, NbStack, and NbCluster compose layouts the way design tools think about them: rows, columns, gaps.

  • Typed end-to-end

    Full TypeScript definitions on every prop, slot, and emit. IDE autocomplete is the contract.

  • Headless where it matters

    Buttons, modals, popovers, and forms expose state hooks so your design system can wear its own skin.

  • Accessible primitives

    Focus management, keyboard navigation, and ARIA shipped in the base layer, not as an afterthought.

What's inside

A focused set, not a sprawl.

Around forty primitives covering layout, forms, navigation, feedback, and overlays. Each one earns its keep across every Nubisco product before it lands in the library.

Layout

  • NbGrid
  • NbStack
  • NbCluster
  • NbContainer
  • NbDivider

Forms

  • NbInput
  • NbSelect
  • NbCheckbox
  • NbRadio
  • NbToggle
  • NbField

Action

  • NbButton
  • NbIconButton
  • NbMenu
  • NbDropdown

Feedback

  • NbToast
  • NbModal
  • NbPopover
  • NbBadge
  • NbSpinner

How it's licensed

MIT, no strings.

Nubisco UI is released under the MIT licence. Use it in commercial work, fork it, redistribute it. The only thing we ask is that you keep the licence header. Source, issues, and releases live on GitHub.

View on GitHub

FAQ

Questions teams ask before adopting.

  • Is this production-ready?

    Yes. Every Nubisco product, including this site, runs on Nubisco UI. We dogfood breaking changes long before they ship to the public package.

  • How does theming work?

    All design decisions are SCSS custom properties exposed at the document root. Override them per-product or per-context. No CSS-in-JS runtime, no theme provider component required.

  • Does it work without Vue?

    No. The library targets Vue 3 specifically. The token engine and SCSS layer are framework-agnostic and can be used on their own if you only need the design primitives.

  • Are there breaking changes?

    We follow semver strictly. Breaking changes only ship in major versions, with a migration note in the release.

Start building on Nubisco UI.

Read the docs, scan the components, and ship a typed Vue 3 app the same week.

View documentationView on GitHub