Web Design Guidelines
Helps with web development, design, guidelines as part of building frontend UIs and user experiences workflows.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add davila7-web-design-guidelines npx -- -y @trustedskills/davila7-web-design-guidelines
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"davila7-web-design-guidelines": {
"command": "npx",
"args": [
"-y",
"@trustedskills/davila7-web-design-guidelines"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill provides a set of web design guidelines that help ensure consistency, usability, and visual appeal in frontend development. It includes best practices for layout, typography, color schemes, accessibility, and responsive design.
When to use it
- When starting a new project and needing a foundation for consistent UI/UX design
- When redesigning an existing website to improve user experience and aesthetics
- When working on cross-platform or mobile-first projects that require responsive layouts
Key capabilities
- Best practices for layout structure and grid systems
- Recommendations for typography and font pairing
- Guidance on accessible color contrast and semantic HTML
- Responsive design techniques for multiple screen sizes
Example prompts
- "What are the best practices for creating a responsive navigation bar?"
- "How should I choose a color scheme that is both visually appealing and accessible?"
- "Can you provide guidelines for implementing a mobile-first layout?"
Tips & gotchas
- Ensure your design tools support the latest web standards to take full advantage of these guidelines.
- Always test designs across multiple devices and browsers to confirm responsiveness and accessibility.
Tags
TrustedSkills Verification
Unlike other registries that point to live repositories, TrustedSkills pins every skill to a verified commit hash. This protects you from malicious updates — what you install today is exactly what was reviewed and verified.
Security Audits
| Gen Agent Trust Hub | Pass |
| Socket | Pass |
| Snyk | Pass |
🌐 Community
Passed automated security scans.