Tailwindcss: How can I add "text-indent" with TailwindCSS

[ghost]

Is there any way to add "text-indent" with TailwindCSS ?

[hacknug]

You can use one of these two plugins:

• https://www.npmjs.com/package/tailwindcss-text-indent
• https://www.npmjs.com/package/tailwindcss-typography

[adamwathan]

Yep those will work, or you can just follow the instructions for adding your own utilities in the documentation:

https://tailwindcss.com/docs/adding-new-utilities

[MarcelloTheArcane]

@adamwathan Is there any way to add the default numbers?

For example widths have the increments 1, 2, 3, 4, 5, 6, 8, 10, ... 56, 64 which correspond to specific rems.

I'd like to be able to make a utility for .indent-1, .indent-2, etc programmatically.

[adamwathan]

@MarcelloTheArcane Use this plugin:

https://www.npmjs.com/package/tailwindcss-text-indent

...and configure it like this:

// tailwind.config.js
module.exports = {
  theme: {
    textIndent: theme => theme('spacing'),
    // ...
  },
  // ...
}