@rootreeweb/tailwind-theme

What is This?

The Rootree TailwindCSS Theme is a set of pre-made colours, screen sizes, and animations for use in projects that utilize TailwindCSS. This package provides a consistent design system across Rootree projects, ensuring visual harmony and reducing development time.

Getting Started

1. The first step (if you haven't done so already) is to setup authentication for using our private packages. You can find instructions for doing that within the Rootree Repository.

2. Install the package:

yarn add -D @rootreeweb/tailwind-theme

Usage

1. Import the theme in your primary CSS file:

@import "../node_modules/@rootreeweb/tailwind-theme/dist/config.css";
@import "tailwindcss";

2. Start using the theme classes in your components:

export function ExampleComponent() {
	return <div className="bg-fire text-foliage"></div>;
}