@kematzy/tailwind

0.0.6 • Public • Published

@kematzy/tailwind

A personal collection of Tailwind CSS plugins for faster development

Available plugins:

  • Colors - plugins/colors provides a range of theme colours as CSS variables together with Tailwind classes

  • Alerts - plugins/alerts provides styling for alert components

  • Badges - plugins/badges provides styling for badge components

  • Buttons - plugins/buttons provides styling for button components

  • Scrollbars - plugins/scrollbars provides better styling for scrollbars on some browsers

  • Shiki - plugins/shiki provides formatting for Code Blocks in the styling of VS Code

  • Tabs - plugins/tabs provides easy tab formatting support

  • Tables - plugins/tables provides easy table formatting support

  • Text-Columns - plugins/text-columns simple plugin that provides easy text columns support

  • Debug - plugins/debug provides some media query guides based upon the browser width

More plugins will be added

Usage

Install the NPM package first of all

pnpm add -d @kematzy/tailwind

Then in top of your tailwind.config.js file extract the required plugins like this:

// import required plugins
import {
  colors,  // note colors must always be loaded first

  alerts,
  badges,
  buttons,
  scrollbars,
  shiki,
  textColumns,
  tabs,
  tables
  debug
} from '@kematzy/tailwind'

/** @type {import('tailwindcss').Config} */
module.exports = {
  // snip
}

Then add the plugin to the plugins: [] array like this.

// snip
plugins: [
  colors,

  alerts,
  badges,
  buttons,
  scrollbars,
  shiki,
  textColumns,
  tabs,
  tables,

  debug,
],
// snip

Package Sidebar

Install

npm i @kematzy/tailwind

Weekly Downloads

1

Version

0.0.6

License

ISC

Unpacked Size

147 kB

Total Files

57

Last publish

Collaborators

  • kematzy