@biem/ui

Getting Started

How to install @biem/ui and structure your projects.

@biem/ui is a React component library. Install it once, load its stylesheets and start importing components.

Installation

Add the package to the dependencies of the app.

package.json
{
	"dependencies": {
		"@biem/ui": "v1.0.0"
	}
}

Styles

Import the styles of @biem/ui in the global stylesheet of the app, in this order.

global.css
@import "@biem/ui/globals.css";
@import "@biem/ui/fonts.css";
@import "@biem/ui/base.css";
@import "@biem/ui/scale.css";
@import "@biem/ui/animations.css";
@import "@biem/ui/typography.css";

Usage

Every component has an import path of its own.

page.tsx
import { Button } from "@biem/ui/components/ui/button";

export default function Page() {
	return <Button>Get Started</Button>;
}

On this page

IntroductionInstallationStylesUsage