Tailwind CSS Starter Kit

Hi There 👋 !

This is Tailwind CSS Starter Kit to help you get started quickly with a new Web project using Tailwind CSS installed with Vite.

Installation

Clone the repository

git clone https://github.com/ciphersweet/tailwind-starter-kit.git

Install npm dependencies

npm install

Customise your tailwind.config.cjs

Example

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ],
  theme: {
    colors: {
      transparent: 'transparent',
      current: 'currentColor',
      'white': '#ffffff',
      'purple': '#3f3cbb',
      'midnight': '#121063',
      'metal': '#565584',
      'tahiti': '#3ab7bf',
      'silver': '#ecebff',
      'bubble-gum': '#ff77e9',
      'bermuda': '#78dcca',
    },
    extend: {},
  },
  plugins: [],
}

Kickoff the dev server

npm run dev

Recommended VS Code Setup

An extension.json file is included with this repository to help VS Code install the recommanded extensions for this starter kit:

• Volar (and disable Vetur)
• TypeScript Vue Plugin (Volar).
• Tailwind CSS IntelliSense

Have fun!