responsive_design
✓유동적인 컨테이너, 유연한 단위, 미디어 쿼리, 모든 화면 크기에서 작동하는 터치 친화적인 디자인을 사용하여 반응성이 뛰어난 모바일 중심 레이아웃을 구축하세요. UI 레이아웃, 반응형 그리드, 중단점 스타일, 모바일 탐색 또는 다양한 화면 크기에 적응해야 하는 인터페이스를 만들거나 수정할 때 이 기술을 사용하세요. 반응형 CSS, 미디어 쿼리, 뷰포트 설정, Flexbox/그리드 레이아웃, 모바일 우선 스타일, 중단점 정의(모바일, 태블릿, 데스크톱), 터치 대상 크기 조정, 상대 단위(rem, em, %), 다양한 화면에 대한 이미지 최적화 또는 여러 장치에서 레이아웃을 테스트할 때 적용합니다. 다중 장치 지원, 반응형 디자인 패턴 또는 적응형 레이아웃과 관련된 모든 작업에 사용하세요.
SKILL.md
Rule: Mobile-first development with consistent breakpoints, fluid layouts, relative units, and touch-friendly targets.
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.
Always start with mobile layout, then enhance for larger screens.
유동적인 컨테이너, 유연한 단위, 미디어 쿼리, 모든 화면 크기에서 작동하는 터치 친화적인 디자인을 사용하여 반응성이 뛰어난 모바일 중심 레이아웃을 구축하세요. UI 레이아웃, 반응형 그리드, 중단점 스타일, 모바일 탐색 또는 다양한 화면 크기에 적응해야 하는 인터페이스를 만들거나 수정할 때 이 기술을 사용하세요. 반응형 CSS, 미디어 쿼리, 뷰포트 설정, Flexbox/그리드 레이아웃, 모바일 우선 스타일, 중단점 정의(모바일, 태블릿, 데스크톱), 터치 대상 크기 조정, 상대 단위(rem, em, %), 다양한 화면에 대한 이미지 최적화 또는 여러 장치에서 레이아웃을 테스트할 때 적용합니다. 다중 장치 지원, 반응형 디자인 패턴 또는 적응형 레이아웃과 관련된 모든 작업에 사용하세요. 출처: vuralserhat86/antigravity-agentic-skills.
인용 가능한 정보
AI/검색 인용용 안정적인 필드와 명령어.
- 설치 명령어
npx skills add https://github.com/vuralserhat86/antigravity-agentic-skills --skill responsive_design- 카테고리
- *크리에이티브
- 인증됨
- ✓
- 최초 등록
- 2026-02-01
- 업데이트
- 2026-02-18
빠른 답변
responsive_design이란?
유동적인 컨테이너, 유연한 단위, 미디어 쿼리, 모든 화면 크기에서 작동하는 터치 친화적인 디자인을 사용하여 반응성이 뛰어난 모바일 중심 레이아웃을 구축하세요. UI 레이아웃, 반응형 그리드, 중단점 스타일, 모바일 탐색 또는 다양한 화면 크기에 적응해야 하는 인터페이스를 만들거나 수정할 때 이 기술을 사용하세요. 반응형 CSS, 미디어 쿼리, 뷰포트 설정, Flexbox/그리드 레이아웃, 모바일 우선 스타일, 중단점 정의(모바일, 태블릿, 데스크톱), 터치 대상 크기 조정, 상대 단위(rem, em, %), 다양한 화면에 대한 이미지 최적화 또는 여러 장치에서 레이아웃을 테스트할 때 적용합니다. 다중 장치 지원, 반응형 디자인 패턴 또는 적응형 레이아웃과 관련된 모든 작업에 사용하세요. 출처: vuralserhat86/antigravity-agentic-skills.
responsive_design 설치 방법은?
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/vuralserhat86/antigravity-agentic-skills --skill responsive_design 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다
소스 저장소는 어디인가요?
https://github.com/vuralserhat86/antigravity-agentic-skills
상세
- 카테고리
- *크리에이티브
- 출처
- skills.sh
- 최초 등록
- 2026-02-01