responsive-layout-builder
Responsive Layout Builder
Instructions
When building responsive layouts:
- Identify the layout pattern (grid, sidebar, cards, etc.)
- Start mobile-first
- Use appropriate CSS technique (Grid vs Flexbox)
- Add breakpoints for larger screens
- Test across viewports
Breakpoints
/* Tailwind defaults */
sm: 640px /* Small devices */
md: 768px /* Tablets */
lg: 1024px /* Laptops */
More from onewave-ai/claude-skills
landing-page-copywriter
Write high-converting landing page copy using proven frameworks like PAS (Problem-Agitate-Solution), AIDA, and StoryBrand. Creates headlines, value propositions, CTAs, and full page sections optimized for conversion. Use when users need landing page copy, sales page content, or marketing website text.
3.2Kcode-review-pro
Comprehensive code review covering security vulnerabilities, performance bottlenecks, best practices, and refactoring opportunities. Use when user requests code review, security audit, or performance analysis.
2.1Kcsv-excel-merger
Merge multiple CSV/Excel files with intelligent column matching, data deduplication, and conflict resolution. Handles different schemas, formats, and combines data sources. Use when users need to merge spreadsheets, combine data exports, or consolidate multiple files into one.
658technical-writer
Write comprehensive technical documentation including user guides, how-to articles, system architecture docs, onboarding materials, and knowledge base articles. Creates clear, structured documentation for technical and non-technical audiences. Use when users need technical writing, documentation, tutorials, or knowledge base content.
582screenshot-to-code
Convert UI screenshots into working HTML/CSS/React/Vue code. Detects design patterns, components, and generates responsive layouts. Use this when users provide screenshots of websites, apps, or UI designs and want code implementation.
502knowledge-base-builder
FAQ identification from support tickets, step-by-step tutorial creation, screenshot/video script guidance, search optimization, and self-service deflection tracking.
458