Skip to content
@ui8kit

UI8Kit

React component library based on an 8-pixel grid and atomic design concept
README.md

UI8Kit

A modern, clean, and efficient UI component library blending the strengths of shadcn/ui theming, Mantine-style props, and an 8px design grid for pixel-perfect, scalable interfaces.

🎯 Philosophy

UI8Kit prioritizes clarity over complexity, delivering a pure design foundation without overwhelming gradients, animations, or decorations. Focus on typography, spacing, and content hierarchy for timeless, minimalist UIs.

The Three Pillars

  • 🔧 shadcn/ui Theming: Modern CSS variables, Tailwind integration, automatic dark mode, and HSL color system.
  • 📏 Mantine Props Consistency: Intuitive APIs, TypeScript safety, and composable components.
  • 🎨 8px Design Grid System: Consistent spacing, harmonious typography, and scalable visual hierarchy.

✨ Key Features

  • Clean Design System: Minimalist aesthetics with subtle shadows and borders.
  • 🌙 Theme System: Built-in themes (LesseUI, ModernUI, SkyOS), dark/light mode, and localStorage persistence.
  • 🧩 Component Architecture: Core components like Button, Card, Stack, Grid; semantic Typography; flexible Layouts.

Build faster, design smarter—join the UI8Kit community! 🚀

Pinned Loading

  1. aria aria Public

    @ui8kit/aria is the standalone package for those behaviors

    TypeScript

  2. brand-os brand-os Public

    `npx brand-os` is a Node/Bun CLI for four workflows: scaffold UI8Kit-ready Vite + React projects, emit generated assets from a Brand OS schema, parse HTML into a classified and normalized AST

    TypeScript

  3. ui8px-cli ui8px-cli Public

    ui8px validates utility class maps against an 8 + 4 spacing policy

    TypeScript

  4. cli cli Public

    Official CLI for bootstrapping and managing UI8Kit component workflows in Vite React projects

    TypeScript

Repositories

Showing 10 of 10 repositories

Top languages

Loading…

Most used topics

Loading…