Docs

Install PristineUI

Install PristineUI and start using components.

Install

Add the package to your project.

pnpm add @gmook9/pristine-ui

Import the CSS

PristineUI ships a compiled stylesheet. Import it once in your app layout (Next.js App Router) or main entry file.

Next.js App Router

Add this near the top of: app/layout.tsx

import "@gmook9/pristine-ui/styles.css";

Other setups

Import it once in your entry file (example):

import "@gmook9/pristine-ui/styles.css";

Use components

Import and render components like any other React library.

import { Button, Card, CardHeader, CardContent } from "@gmook9/pristine-ui";

export default function Example() {
  return (
    <Card>
      <CardHeader>
        <h3 className="text-lg font-semibold">Hello</h3>
      </CardHeader>
      <CardContent className="space-y-3">
        <Button variant="primary">Primary</Button>
        <Button variant="ghost">Ghost</Button>
      </CardContent>
    </Card>
  );
}