Get started with Typewind

Setup Tailwind

Make sure you have Tailwind setup. You can follow the official Tailwind Installation docs (opens in a new tab) to get started.

Installation

Install typewind via npm

npm install typewind

Generating type definitions

typewind generate goes through your tailwind.config.js and generates type definitions and css docs based on your theme. This means that the type definitions will be custom to your configuration, and include styles for plugins etc.

npx typewind generate

It is recommended to set this as your postinstall script:-

{
  "scripts": {
    "postinstall": "typewind generate"
  }
}

Quick Start

const { typewindTransforms } = require('typewind/transform');
 
/** @type {import('tailwindcss').Config} \*/
module.exports = {
  content: {
    files: ['./src/**/*.{js,jsx,ts,tsx}'],
    transform: typewindTransforms,
  },
};