Skip to main content

Tailwind CSS ↔ CSS Framework with huge Utility Class collection, VSC IDE-support for efficient consistent minimal CSS

Source: tailwindcomponents.com/cheatsheet/

aka Tailwind, TailwindCSS

Tailwind UI​

paywall collection of prebuilt UI component/template by Tailwind dev

tailwindcss-cli​

npm CLI Dev tool to run PostCSS to Preprocess/Tree-Shake CSS

Utility Class​

class library with predefined rules for DRY Code & consistent naming scheme, & more granular custom control over groups of base CSS styles

Tailwind Definition

Tailwind Setup

npx tailwindcss-cli@latest init​

to autogen tailwind.config.cjs

src/index.css​

base CSS fle to include Tailwind for project via @tailwind Directive

Tailwind Syntax

References​

  1. Tailwind CSS Intellisense ↔ autocomplete, hint prompt, error highlight for Tailwind - combine with extra tailwind-prettier plugin to auto sort class names

  2. src/index.css ↔ base CSS fle to include Tailwind for project via @tailwind Directive

  3. content: string[] ↔ MUST to set file/folder to scan via Glob. set entry _index.html & any script files using Tailwind