Tulip
Getting Started

Installation

Install Tulip packages, peer dependencies, and styles.

Tulip ships as a modular package. Install the core package and peer dependencies based on the entry points you plan to use.

Install packages

pnpm add @tulip-systems/core

If you plan to use auth, routing, or data tables, you also need the peer dependencies listed in the package:

pnpm add next react react-dom nuqs pg better-auth @better-auth/passkey

If you are only using UI primitives and utils, you can omit the auth and database dependencies.

Add styles

Tulip ships a shared stylesheet. Import it once in your app entry.

import "@tulip-systems/core/styles.css";

In Next.js, the safest place is your root layout:

// app/layout.tsx
import "@tulip-systems/core/styles.css";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>{children}</body>
    </html>
  );
}

Verify install

Try importing a helper from the core package:

import { formatDate } from "@tulip-systems/core/lib";

formatDate(new Date());

If your app builds, Tulip is ready.

On this page