Skills
.Work. You
Rest

responsive-web-app

Community

Build fluid, adaptive web experiences.

Design & Creative#web development#responsive design#mobile-first#css#ui/ux#adaptability
Authorthanhnh98
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides comprehensive guidance and patterns for creating websites that adapt seamlessly to any screen size, ensuring optimal user experience across all devices.

Core Features & Use Cases

  • Mobile-First Design: Prioritize mobile user experience and progressively enhance for larger screens.
  • Fluid Grids & Typography: Implement flexible layouts and scalable text using modern CSS techniques like clamp().
  • Responsive Images & Media: Optimize image loading and display for various resolutions and viewports.
  • Touch-Friendly Interactions: Ensure buttons and interactive elements are easily usable on touch devices.
  • Use Case: When developing a new e-commerce product page, use this Skill to ensure product images, descriptions, and the "Add to Cart" button are perfectly displayed and functional on both a user's smartphone and their desktop monitor.

Quick Start

Apply the mobile-first approach to design the layout for a new landing page.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: responsive-web-app
Download link: https://github.com/thanhnh98/thanhnh98.github.io/archive/main.zip#responsive-web-app

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.