Tailwind CSS Triangle Generator

With this generator, you'll be able to create triangles of any shape, size, and color using TailwindCSS. While existing CSS triangle generators work great, it is an inconvenience to translate the styles to Tailwind styles. This tool aims to make that process easier by generating Tailwind CSS classes for any triangle you can think of. Hope you find it helpful!

Up

Direction
º

Hex code or Tailwind color name (e.g. "blue-500")

Tailwind CSS Classes:

Ryan Chiang

Meet the Author

Ryan Chiang

Hello, I'm Ryan. I build things and write about them. This is my blog of my learnings, tutorials, and whatever else I feel like writing about.
See what I'm building →.

Thanks for reading! If you want a heads up when I write a new blog post, you can subscribe below:

2024

2023

© 2023 Ryan Chiang|ryanschiang.com