Frontend Responsive Jeremyrdavis

---
name: frontend-responsive
description: Implement responsive designs that work across mobile, tablet, and desktop screen sizes. Use this skill when applying mobile-first development patterns, using responsive breakpoints, creating fluid layouts with percentage-based widths, choosing relative units (rem/em) over pixels, ensuring touch-friendly tap targets, or optimizing images for mobile. Applies when working on any frontend layout code, media queries, responsive utilities, and when testing UI across different screen sizes.
---

## When to use this skill

- When implementing mobile-first CSS and layouts
- When using responsive breakpoints (mobile, tablet, desktop)
- When creating fluid layouts with percentage-based widths
- When choosing rem/em units over fixed pixels
- When ensuring tap targets are at least 44x44px
- When optimizing images and assets for mobile
- When maintaining readable typography across breakpoints
- When prioritizing content for smaller screens
- When testing layouts across different screen sizes
- When using responsive utility classes (e.g., Tailwind's sm:, md:, lg:)
- When writing media queries for layout changes

# Frontend Responsive

This Skill provides Claude Code with specific guidance on how to adhere to coding standards as they relate to how it should handle frontend responsive.

## Instructions

For details, refer to the information provided in this file:
[frontend responsive](../../../agent-os/standards/frontend/responsive.md)