Tailwindcss: Utility for text-shadow?

Created on 9 Nov 2017  路  6Comments  路  Source: tailwindlabs/tailwindcss

Hey, what about create an utility for text-shadow? :)

Most helpful comment

I also needed it on a project and added them based on shadow utility for now:

@responsive {
  .text-shadow {
    text-shadow: 0 2px 4px rgba(0,0,0,0.10);
  }

  .text-shadow-md {
    text-shadow: 0 4px 8px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.08);
  }

  .text-shadow-lg {
    text-shadow: 0 15px 30px rgba(0,0,0,0.11), 0 5px 15px rgba(0,0,0,0.08);
  }

  .text-shadow-none {
    text-shadow: none;
  }
}

All 6 comments

I also needed it on a project and added them based on shadow utility for now:

@responsive {
  .text-shadow {
    text-shadow: 0 2px 4px rgba(0,0,0,0.10);
  }

  .text-shadow-md {
    text-shadow: 0 4px 8px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.08);
  }

  .text-shadow-lg {
    text-shadow: 0 15px 30px rgba(0,0,0,0.11), 0 5px 15px rgba(0,0,0,0.08);
  }

  .text-shadow-none {
    text-shadow: none;
  }
}

We're not opposed to adding this at some point, but going to skip it for now since it's so easy to add utilities yourself.

We may revisit this sooner once we've made it easy to opt in/out of different modules.

@adamwathan is this still going to be considered?

You can use @benface's plugin for this: https://github.com/benface/tailwindcss-typography

Just commenting in 2020 that this little utility is still welcome : )

Hi @adamwathan. Yes, this is easy to add. But what are the disadvantages of adding a few more utility classes to Tailwind? Why should all Tailwind users, who need this, add it themselves?

I guess, the situation has changed in the meantime, and there wouldn't be any disadvantage today to add more utility classes.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

dbpolito picture dbpolito  路  3Comments

chasegiunta picture chasegiunta  路  3Comments

ghost picture ghost  路  3Comments

afuno picture afuno  路  3Comments

jvanbaarsen picture jvanbaarsen  路  3Comments