plugins/tailwindcss/skills/tailwindcss-responsive/SKILL.md
Responsive design, breakpoints, container queries
npx skillsauth add fusengine/agents tailwindcss-responsiveInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
| Variant | Size | CSS |
|---------|--------|-----|
| sm: | 40rem (640px) | @media (width >= 40rem) |
| md: | 48rem (768px) | @media (width >= 48rem) |
| lg: | 64rem (1024px) | @media (width >= 64rem) |
| xl: | 80rem (1280px) | @media (width >= 80rem) |
| 2xl: | 96rem (1536px) | @media (width >= 96rem) |
@theme {
--breakpoint-3xl: 120rem;
}
/* Usage: 3xl:grid-cols-6 */
<div class="@container">
<div class="@md:grid-cols-2 @lg:grid-cols-3">
<!-- Responsive to container -->
</div>
</div>
<div class="text-sm md:text-base lg:text-lg">
<!-- Small screens first -->
</div>
development
Use when optimizing entity-based / semantic SEO 2026. Covers entity maps, Google Knowledge Graph resolution, salience scoring, passage-level ranking, about/sameAs/knowsAbout schema, Cloud Natural Language API validation.
development
Use when running SEO, GEO, schema, Core Web Vitals, sitemap, hreflang, E-E-A-T, AI Overviews, technical SEO, or structured data tasks. Covers full-site audits, single-page analysis, schema markup, content quality, AI search optimization, local SEO, sitemap/robots, internal linking, semantic clustering, and search experience.
development
Use when optimizing search experience (SXO). Covers intent matching, user personas, user stories, page-type analysis, dwell time, scroll depth, pogo-sticking prevention.
development
Use when optimizing local SEO. Covers Google Business Profile, NAP consistency, citations, reviews acquisition, Local Pack ranking, location pages, LocalBusiness schema.