tailwindcss-autofill

🎨 TailwindCSS variant to style autocompleted form fields.

Usage no npm install needed!

<script type="module">
  import tailwindcssAutofill from 'https://cdn.skypack.dev/tailwindcss-autofill';
</script>

README

🎨 tailwindcss-autofill

npm version GitHub license

Add TailwindCSS variant to style autocompleted form fields.

Install

yarn add tailwindcss-autofill

Or if you use npm:

npm i --save tailwindcss-autofill

Usage

Add to plugins in your tailwind.config.js:

module.exports = {
  // ...
  plugins: [
    require("tailwindcss-autofill"),
    // Other plugins.
  ],
  variants: {
    extend: {
      borderColor: ["autofill", "dark"], // Enable `autofill` variant for plugins you want.
    },
  },
};

Style your components with autofill::

<input className="border border-gray-100 autofill:border-gray-900" />

Requirements

  • Node.js 12+

  • TailwindCSS 2

Made by @phuctm97.