{"id":50885886,"url":"https://github.com/aryanony/uibrium","last_synced_at":"2026-06-15T17:00:46.390Z","repository":{"id":350858034,"uuid":"1208533907","full_name":"aryanony/uibrium","owner":"aryanony","description":"repo: **UiBrium** is a premium, open-source design system and React component library engineered for high-fidelity user experiences and deterministic UI integrity. It bridges the gap between high-end \"couture\" aesthetics and rigid technical standards.  [**Explore Documentation**](https://uibrium.vercel.app) ","archived":false,"fork":false,"pushed_at":"2026-05-14T09:17:45.000Z","size":2311,"stargazers_count":2,"open_issues_count":24,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-14T11:30:18.232Z","etag":null,"topics":["accessible","component-library","dark-mode","design-system","framer-motion","lucide-react","monorepo","open-source","pnpm","radix-ui","react","react-components","tailwindcss","turborepo","typescript","ui-components"],"latest_commit_sha":null,"homepage":"https://uibrium.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aryanony.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-04-12T12:19:21.000Z","updated_at":"2026-05-14T09:16:16.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/aryanony/uibrium","commit_stats":null,"previous_names":["aryanony/uibrium"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/aryanony/uibrium","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aryanony%2Fuibrium","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aryanony%2Fuibrium/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aryanony%2Fuibrium/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aryanony%2Fuibrium/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aryanony","download_url":"https://codeload.github.com/aryanony/uibrium/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aryanony%2Fuibrium/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34372130,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-15T02:00:07.085Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["accessible","component-library","dark-mode","design-system","framer-motion","lucide-react","monorepo","open-source","pnpm","radix-ui","react","react-components","tailwindcss","turborepo","typescript","ui-components"],"created_at":"2026-06-15T17:00:30.496Z","updated_at":"2026-06-15T17:00:46.382Z","avatar_url":"https://github.com/aryanony.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Uibrium — Build Smarter. Ship Faster.\n\n\u003cpicture\u003e\n  \u003csource srcset=\"lightMode.png\" media=\"(prefers-color-scheme: light)\"\u003e\n  \u003csource srcset=\"darkMode.png\" media=\"(prefers-color-scheme: dark)\"\u003e\n  \u003cimg alt=\"Uibrium Logo\" src=\"lightMode.png\"\u003e\n\u003c/picture\u003e\n\n[![npm (scoped)](https://img.shields.io/npm/v/@uibrium/ui?style=flat-square)](https://www.npmjs.com/package/@uibrium/ui)\n[![CI](https://github.com/aryanony/uibrium/actions/workflows/ci.yml/badge.svg)](https://github.com/aryanony/uibrium/actions/workflows/ci.yml)\n[![License: MIT](https://img.shields.io/npm/l/@uibrium/ui?style=flat-square)](LICENSE)\n[![Docs](https://img.shields.io/website?down_color=lightgrey\u0026down_message=offline\u0026up_color=blue\u0026up_message=online\u0026url=https%3A%2F%2Fuibrium.vercel.app)](https://uibrium.vercel.app/)\n[![Storybook](https://img.shields.io/badge/Storybook-Deployed-ff4785?logo=storybook)](https://aryanony.github.io/uibrium/)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](CONTRIBUTING.md)\n[![GitHub stars](https://img.shields.io/github/stars/aryanony/uibrium?style=social)](https://github.com/aryanony/uibrium)\n[![GitHub forks](https://img.shields.io/github/forks/aryanony/uibrium?style=social)](https://github.com/aryanony/uibrium)\n\nUibrium is a **premium, open-source React design system and component library** that marries couture design with rock-solid engineering. It delivers **high-fidelity user experiences** with **deterministic UI integrity**, balancing beauty and performance in every element. With Uibrium, developers get a **modular, themable toolkit** built on industry best-practices.\n\n## Highlights\n\n- 🎯 **Accessible Primitives:** Built on [Radix UI](https://radix-ui.com/) for 100% WAI-ARIA compliance. All base elements (buttons, inputs, etc.) are fully accessible from day one.\n- 🎨 **Tailwind-Driven Styling:** Utility-first classes with a **pure HSL design token palette**, ensuring consistency. You get all of Tailwind’s power and a custom, premium color system.\n- ⚡ **Sensory Animations:** Breathtaking motion with [Framer Motion](https://www.framer.com/motion/) and magnetic “sensory engineering” (custom cursor, loaders, etc.), adding polished micro-interactions to your UI.\n- 🔀 **Tree-Shaking Ready:** Exports optimized ESM and CJS bundles (with `sideEffects: false`), so unused code is dropped in production builds. Every component is fully typed in TypeScript.\n- 🌐 **Theming:** Built-in light/dark themes using CSS variables. Swap or extend themes easily, leveraging Uibrium’s HSL token API.\n- 🤖 **Automated Documentation:** Fully automated Storybook story generation. Simply create a component, and the sanctuary handles the documentation for you.\n- 🌍 **Open Source:** Premium design accessible to all. Contributions are welcome – see [Contributing](#contributing).\n\n## Installation\n\nInstall via npm, yarn or pnpm (Uibrium uses `@uibrium/ui` as the package name) along with its peer dependencies:\n\n```bash\n# Using pnpm (recommended)\npnpm add @uibrium/ui framer-motion lucide-react\n\n# Using npm\nnpm install @uibrium/ui framer-motion lucide-react\n\n# Using yarn\nyarn add @uibrium/ui framer-motion lucide-react\n```\n\n## Quick Start\n\nImport Uibrium’s components and styles in your app. Wrap your app in the `\u003cThemeProvider\u003e` to enable theming, and add the `\u003cCustomCursor\u003e` for Uibrium’s signature cursor effect (optional).\n\n```jsx\nimport React from 'react';\nimport { Button, CustomCursor, ThemeProvider } from '@uibrium/ui';\nimport '@uibrium/ui/styles.css';\n\nexport default function App() {\n  return (\n    \u003cThemeProvider\u003e\n      \u003cCustomCursor /\u003e\n      \u003cButton variant=\"primary\" size=\"lg\"\u003e\n        Initiate Equilibrium\n      \u003c/Button\u003e\n    \u003c/ThemeProvider\u003e\n  );\n}\n```\n\nThis renders a styled **primary button** in large size. The `ThemeProvider` ensures all components use Uibrium’s theme tokens, and `CustomCursor` adds the premium cursor animation.\n\n## Components List\n\nUibrium features a comprehensive set of 19+ premium components:\n\n| Component     | Status       | Component     | Status       |\n| ------------- | ------------ | ------------- | ------------ |\n| Accordion     | ✅ Available | Dropdown Menu | ✅ Available |\n| Alert         | ✅ Available | Input         | ✅ Available |\n| Avatar        | ✅ Available | Modal/Dialog  | ✅ Available |\n| Badge         | ✅ Available | Pagination    | ✅ Available |\n| Button        | ✅ Available | Radio Group   | ✅ Available |\n| Card          | ✅ Available | Select        | ✅ Available |\n| Checkbox      | ✅ Available | Switch        | ✅ Available |\n| Custom Cursor | ✅ Available | Table         | ✅ Available |\n| Drawer        | ✅ Available | Tabs          | ✅ Available |\n| Tooltip       | ✅ Available | Textarea      | ✅ Available |\n\n## Local Development\n\nWant to run the project locally? Follow these steps:\n\n```bash\n# Clone the repository\ngit clone https://github.com/aryanony/uibrium.git\ncd uibrium\n\n# Install dependencies using pnpm\npnpm install\n\n# Start the component library in watch mode\npnpm dev\n\n# Start the docs site locally\npnpm dev:docs\n\n# Start Storybook\npnpm storybook\n```\n\n## Architecture\n\nUibrium is organized as a **monorepo** (using PNPM Workspaces and Turborepo) to separate the core library from the docs site while allowing seamless development:\n\n```\nuibrium/\n├── packages/ui/       # Core component library (Vite + TypeScript)\n├── apps/docs/         # Documentation site (Next.js on Vercel)\n├── .storybook/        # Storybook configuration\n├── .github/           # CI/CD, issue templates, security policy\n├── .changeset/        # Versioning \u0026 changelog automation\n└── turbo.json         # Turborepo task orchestration\n```\n\n- `/packages/ui` – The **core component library**. Contains all components, styles, tokens, and build configs. Built with Vite (library mode) and TypeScript.\n- `/apps/docs` – The **documentation site** (Next.js). It consumes `@uibrium/ui` directly from the repo so that demos always use the latest changes.\n\n## Theming\n\nUibrium comes with default light and dark themes. All component styles use CSS variables for colors, spacing, fonts, etc. To customize, override the token values in your own CSS or extend the `\u003cThemeProvider\u003e`. For example, swap the primary color hue by updating `--ui-primary-hue` in CSS. Because Uibrium uses HSL tokens under the hood, color adjustments affect the entire palette gracefully.\n\n## Roadmap\n\nCheck out our [ROADMAP.md](ROADMAP.md) to see what we're working on next. You can also view our [GitHub Projects Board](https://github.com/aryanony/uibrium/projects) for real-time progress tracking.\n\n## Discussions \u0026 Community\n\nHave a question? Want to share what you've built? Join our [GitHub Discussions](https://github.com/aryanony/uibrium/discussions)!\n\n- 📣 Announcements\n- 💡 Component Requests\n- 🙋 Introductions\n- 🎉 Show and Tell\n\n## Contributing\n\nUibrium is 100% open source under the MIT License. Every contribution helps raise the baseline for developer tooling!\n\nWe welcome all types of contributions, from fixing typos to building new components. Check out our [Good First Issues](https://github.com/aryanony/uibrium/labels/good%20first%20issue) to get started!\n\n\u003e 🎓 **First time contributing to open source?**\n\u003e We have a dedicated [Beginner Contributor Guide](Uibrium-Contributor-Guide.md) that walks you through making your first pull request step-by-step!\n\nPlease read our full [CONTRIBUTING.md](CONTRIBUTING.md) guide before opening a PR.\n\n## Contributors\n\nThanks to everyone who has contributed! 🎉\n\n[![Contributors](https://contrib.rocks/image?repo=aryanony/uibrium)](https://github.com/aryanony/uibrium/graphs/contributors)\n\n## Security\n\nPlease report security vulnerabilities responsibly. See our [Security Policy](.github/SECURITY.md) for details.\n\n## Code of Conduct\n\nWe are committed to providing a welcoming community. Please read our [Code of Conduct](CODE_OF_CONDUCT.md).\n\n## License\n\nReleased under the MIT License. See [LICENSE](LICENSE) for details.\n\n---\n\n_Created by [Aaryan Gupta](https://github.com/aryanony) · Made with ❤️ by the UiBrium community · Build smarter, ship faster._\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faryanony%2Fuibrium","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faryanony%2Fuibrium","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faryanony%2Fuibrium/lists"}