TailwindCSS Tips

2 Ways to Center an Absolute Positioned Element in TailwindCSS

In TailwindCSS, centering an element may be a challenge for beginners if they don't know the core concepts of CSS. You can center a...

2 Ways to Add Default Font Color and Size in TailwindCSS

TailwindCSS resets the default styles of every HTML element. If you are following a design system, you might have a default font size and...

2 Ways to Place Text on Image in TailwindCSS – [Text over Image]

Text over an image is very common in modern website design. Images having text on the top looks nice and also engage users on...

How to Add Divider Lines in TailwindCSS – [Vertical & Horizontal]

Modern UI designs have divider lines in almost everything. Web designers use a border or <hr/> tag to add divider line on web pages....

List of FREE SVG Icons for TailwindCSS

SVG icons are a great way to guide users. When you are working with TailwindCSS, it's good to have SVG code instead of importing...

Change Color and Strokes of SVG Icon in TailwindCSS

SVG Icons are great in website design because these can be added directly to the code instead of imported as images. In TailwindCSS, you...

Nested Child Selector in TailwindCSS – [Style Nested Eelements]

When you are designing complex user interfaces you might have nested child elements that you want to style. TailwindCSS provides arbitrary values to select...

The :not Selector in TailwindCSS – [ :not-first and :not-last ]

The :not selector in TailwindCSS is pretty much similar to the :nth selector. The :not selector is helpful in various use cases, for example,...

How to Create Transparent Text in TailwindCSS

You can apply different CSS Blend Modes options in TailwindCSS to get almost any effect you want. In TailwindCSS, there are different classes for...

Latest articles