Tailwind CSS Tips
4.13K subscribers
101 photos
1 video
135 links
โ„น๏ธ Learn the most popular utility-first framework.

๐Ÿ”ฅ #tips, โญ๏ธ #tricks, ๐Ÿ†• #news

Maintainer: @ilyosjon_k
Download Telegram
๐Ÿ”ฅ #component #useful

An upload button with group hover


https://tailwind.run/febEks/2

ยฉ @tailwindcss_tips
๐Ÿ”ฅ #component

Responsive Sidebar Navigation

By Simon Depelchin

https://codepen.io/simondepelchin/full/ypwEBN
๐Ÿ”ฅ #news #useful

Finally Tailwind UI, the component library by the creators of the framework, has been released!

Components buy a license to use them. However, you can get an inpiration.

Check out some free components:
๐Ÿ‘‰ https://tailwindui.com/preview
๐Ÿ”ฅ#new_version #news

Tailwindcss v1.3 has been released

Release notes๐Ÿ‘‡
https://github.com/tailwindcss/tailwindcss/releases/tag/v1.3.0
๐Ÿ”ฅ #template #tailwindui

Tailwind UI Marketing Header Example by Adam Wathan

๐Ÿ‘‰ https://codepen.io/adamwathan/pen/yLYzvJB?editors=1000
๐Ÿ”ฅ #sample_ui #alpinejs

Simple Todo app using TailwindCSS and AlpineJS

๐Ÿ‘‰ https://codepen.io/ilyosjon/pen/JjYZdOw
๐Ÿ”ฅ #component

Simple calendar using newly added grid utilities

๐Ÿ‘‰ https://codepen.io/ilyosjon/pen/OJyqbrO
๐Ÿ”ฅ #component

E-Commerce cards by Brian

๐Ÿ‘‰ https://codepen.io/captbrogers/pen/BayPRNz
๐Ÿ”ฅ #tip #gradient

Did you know that TailwindCSS has gradient utilities? You can make awesome gradient backgrounds and even gradient text using them.

๐Ÿ”— Code:
https://codepen.io/ilyosjon/pen/RwaOOgL

๐Ÿ“– Documentation:
https://tailwindcss.com/docs/background-image#linear-gradients

https://tailwindcss.com/docs/background-clip#cropping-to-text
๐Ÿ”ฅ #news #useful

Introducing Tailwind Play - Official playground and code sharing tool for TailwindCSS

๐Ÿ”— https://play.tailwindcss.com