Giter VIP home page Giter VIP logo

vscode-tailwindcss's Introduction

logo

Tailwind CSS Autocomplete for Visual Studio Code

The MIT License Visual Studio Marketplace

Currently supports Tailwind CSS v0.6.5

demo

Features

  • Supports autocomplete for all Tailwind classes
  • Reads your project's tailwind.js config and reacts to changes in realtime
    • Example: Add a new color called lilac to config for text colors and text-lilac will appear in autocomplete instantly
  • Works with several languages modes including HTML, JavaScript, JavaScript React, TypeScript React, PHP and Vue
  • Supports @apply in CSS and SCSS files
  • Supports Emmet shortcuts
  • No need for generated CSS on disk for autocomplete to work (Works with webpack dev server too)

Installation

Install this extension from the VS Code extensions marketplace. Search for Tailwind CSS Autocomplete or go here

You can also install this via Quick Open (โŒ˜P)

ext install sidharthachatterjee.vscode-tailwindcss

Configuration

There is none! ๐ŸŽ‰

This extension reads config from the currently open project's tailwind.js file and that's about it

Known Limitations

  • Currently doesn't generate suggestions for Tailwind prefixes including hover, media query sizes etc
  • Doesn't use the project's version of Tailwind to generate classes so if you're using an older version of Tailwind, you might see mismatched suggestions ๐Ÿ˜ž

Thanks

Contributions

Feel free to open an issue or submit a pull request for anything you think is missing

vscode-tailwindcss's People

Contributors

sidharthachatterjee avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.