Raw UI

Raw UI is a minimalist, customizable React component library for building web application interfaces. It is distributed as an npm package and maintained in the shervinchen/raw-ui GitHub repository under the MIT license. The library is designed for developers who want a clean, unopinionated set of React components that can adapt to their own design language through CSS-in-JS theming.

What is Raw UI?Raw UI is an open-source React component library written in TypeScript that provides minimal, extensible UI components such as Button for composing web application interfaces. It takes a React application as input and, once the root is wrapped in RawUIProvider, outputs styled, themeable React components that work in both client and server environments. The library is maintained under the GitHub project shervinchen/raw-ui and distributed through npm.

Key Features

• Minimal UI design style — a restrained visual default that avoids heavy decoration, making components easy to drop into existing designs.
• Simple and extensible component API — components expose a small set of props and support composition, so you can build custom variations without forking.
• TypeScript support — the entire library is written in TypeScript, giving you predictable static types for component props and theme values.
• Dark mode theme — a built-in dark theme is available, so you can switch your interface to a dark palette without manually overriding every component.
• CSS-in-JS theming — theme customization is powered by CSS-in-JS, allowing you to override design tokens in one place and have all components react.
• SSR compatible — works with server-side rendering frameworks such as Next.js (the repo lists Next.js among its topics), so components render correctly on the server.
• 100% unit test coverage — the library ships with a comprehensive test suite that covers all code paths, reducing the risk of regressions.

Who is it for?Raw UI is for React developers who want a lightweight component library rather than a heavy, opinionated design system. It suits teams that need TypeScript end-to-end, from component props to theme definitions, and developers building applications with server-side rendering who need components that don't break SSR. Design-system builders can also use Raw UI as a base layer, customizing its CSS-in-JS theme variables to match a brand.

What can you do with Raw UI?

• React developers: scaffold a new app's UI quickly by importing Raw UI components and wrapping the root in RawUIProvider; the default theme gives a clean, consistent look from the start.
• Next.js developers: build server-rendered pages with UI components that are SSR-compatible out of the box, and enable dark mode via the built-in theme.
• Design system authors: override the CSS-in-JS theme tokens to create a custom design language, then export those tokens as part of the component library.

How does Raw UI work?Install the package with pnpm add raw-ui or npm install raw-ui --save. Then wrap your application root in a RawUIProvider and import any component — for example, Button — and use it directly in your JSX. The provider supplies theming and context to all descendant components.

AlternativesRaw UI sits alongside other open-source React component libraries. Material UI (MUI) provides components following Google's Material Design guidelines, and Ant Design offers a set of enterprise-grade React components. Raw UI differentiates itself by its minimal visual style and focus on theme customization via CSS-in-JS.

FAQ

Is Raw UI free?Yes. Raw UI is released under the MIT license, which permits free use, modification, and redistribution in private and commercial projects.

How do I install Raw UI?You can install it with pnpm add raw-ui or, if you use npm, with npm install raw-ui --save.

Does Raw UI support dark mode?The library provides a dark mode theme. You can enable it through the theme configuration, and components will switch to the dark palette consistently.

Is Raw UI compatible with server-side rendering?Yes, the library is explicitly compatible with SSR, making it safe to use in frameworks like Next.js that render React on the server.

What is RawUIProvider?RawUIProvider is the context provider you must wrap around your application root. It shares theme and component configuration with all Raw UI children, so every component can access the same styling and behavior.