🎯

responsive-design

🎯Skill

from supercent-io/skills-template

|

What it does

|

Generates responsive web design guidelines and CSS strategies to ensure web interfaces adapt seamlessly across different device screen sizes and resolutions.

Overview

Responsive Design is a Claude Code skill from the Supercent Skills Template collection, focused on generating responsive web design guidelines and CSS strategies. Part of a modular 71-skill system using the TOON format for 95% token reduction.

Key Features

Generates mobile-first CSS with breakpoints for common device categories
Implements fluid typography, flexible grids, and container queries
Creates accessibility-compliant layouts with proper touch targets and contrast ratios

Who is this for?

Developers who want AI-assisted generating responsive web design guidelines and CSS strategies integrated into their Claude Code workflow.

Same repository

supercent-io/skills-template(102 items)

responsive-design

Installation

Vibe Index InstallInstalls to .claude/skills/ - auto-recognized by Claude Code

npx vibeindex add supercent-io/skills-template --skill responsive-design

skills.sh Install⚠ Installs to .agents/skills/ - may not be auto-recognized by Claude Code

npx skills add supercent-io/skills-template --skill responsive-design

Manual InstallCopy SKILL.md content and save to the path below

~/.claude/skills/responsive-design/SKILL.md

SKILL.md

11,234Installs

-

AddedFeb 4, 2026

View on GitHub Back to Skills

More from this repository10

security-best-practices🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

data-analysis🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

web-accessibility🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

workflow-automation🎯Skill

Automates complex multi-step workflows by dynamically generating and executing task sequences with intelligent decision-making and error handling.

code-review🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

database-schema-design🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

code-refactoring🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

backend-testing🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

technical-writing🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.

api-documentation🎯Skill

A skills template providing reusable Claude Code skill configurations for development workflows, designed as a starting point for custom skill creation.