Gotcha: Text Potentially Too Small on Mobile

Potentially Hard-to-Read Mobile Heading

This heading starts at text-xs on mobile. For important headings, this might be too small, making it difficult for users to read easily on smaller screens. Aim for a comfortable base size.

Improved: Ensuring Mobile Readability

More Readable Mobile Heading

This heading starts at text-lg on mobile. This provides better readability on small devices. The classes are text-lg sm:text-xl md:text-2xl lg:text-3xl . Always prioritize readability, especially on mobile.

Reminder: The goal is to ensure text is easily legible on the smallest intended screens, then scale it appropriately for larger views.