Responsive Marketing Website Designer
Design responsive marketing websites with page systems, layouts, visual rhythm, sections, reusable components, and implementation guidance.
Responsive Marketing Website Designer is a free AI skill for ui & web building. Design responsive marketing websites with page systems, layouts, visual rhythm, sections, reusable components, and implementation guidance. It works with Claude, ChatGPT and is ready to use out of the box.
About this skill
Responsive Marketing Website Designer helps teams create polished websites across desktop, tablet, and mobile. It defines page types, grids, spacing, typography, section patterns, navigation, media, components, interactions, responsive transformations, states, accessibility, and handoff.
What it does
The skill analyzes brand, audience, content, conversion goals, reference sites, and technical constraints; creates a complete visual and structural direction; and produces page-level and system-level specifications for design and development.
What is included
- Creative and UX direction
- Page-type system
- Grid and layout rules
- Typography and spacing
- Reusable section patterns
- Navigation and footer behavior
- Responsive transformations
- Developer handoff guidance
How to use it
1. Download the responsive-marketing-website-designer-SKILL.md file 2. Upload it to your design workspace 3. Provide the brand, audience, content, goals, references, and required pages 4. Add technical and accessibility constraints 5. Use the output to create mockups and implementation tasks
Examples
Design a modern responsive marketing website for an AI resource marketplace with homepage, categories, skills, prompts, articles, about, and pricing.
A complete website design direction with page system, grid, typography, section library, cards, navigation, responsive behavior, motion, accessibility, and developer handoff.
FAQ
What is this skill for?
Can it follow a specific visual style?
Does it create every page separately?
Can it support dark and light themes?
Does it include developer handoff?
How is this different from a landing-page skill?
Related Skills
Landing Page Conversion UX Architect
Design high-converting landing pages with clear hierarchy, value communication, trust, calls to action, responsive behavior, and testing.
Landing Page Copy & Layout Generator
Produces complete section-by-section landing page copy and layout structure — hero, benefits, social proof, FAQ, CTA — from a one-line product description.
AI Landing Page Hero Visual Architect
Design landing-page hero visuals with product relevance, focal hierarchy, responsive crops, UI integration, performance, accessibility, and generation prompts.