svgtailwind-cssstroke-dasharray

How to apply stroke-dasharray using tailwind

I'm using tailwind for styling in my React project. I wanted to apply a stroke-dasharray styling to a <circle> element using tailwind classes but after some researching, it seems tailwind does not provide any classes to style those attributes as can be seen in this discussion on the tailwind github repo.

Any ideas?

Solution

  • I already knew about tailwind's arbitrary values but after some more researching, I found out about tailwind's arbitrary properties! This is tailwind's way of allowing styling any properties they are not supporting.

    So in my case I was able to do:

    <circle className="[stroke-dasharray:2,5]" />