Tip 22/72

Use of `visited` Variant

Learn how to use the `visited` variant in TailwindCSS to style visited links.

The visited variant in TailwindCSS allows you to style links that have been visited by the user. This is particularly useful for providing visual feedback to users, helping them distinguish between links they have already clicked and those they have not. This is especially helpful for external links, ensuring users can easily identify which external sites they have already visited.

Basic Usage

You can use the visited variant to apply styles to links that have been visited. This helps users easily identify which links they have already interacted with.

<a href="#" className="text-gray-700 dark:text-gray-300 visited:text-indigo-500 dark:visited:text-indigo-300">
    Visited Link
</a>

Conclusion

Using the visited variant in TailwindCSS allows you to style visited links, providing a better user experience by helping users distinguish between links they have and have not visited. This enhances the usability and accessibility of your application, making it more intuitive and user-friendly.