Web Design Guidelines

The vudovn-web-design-guidelines skill provides a structured framework for generating and evaluating frontend code that adheres to modern aesthetic and functional standards. It ensures consistency across projects by enforcing specific design patterns, color palettes, and responsive behaviors defined within the Antigravity Kit ecosystem.

When to use it

• Standardizing UI components across multiple frontend applications to maintain a cohesive brand identity.
• Generating initial HTML/CSS/JS scaffolds that automatically comply with established accessibility and layout rules.
• Refactoring legacy codebases to align with current design system requirements without manual intervention.
• Validating new feature implementations against predefined visual and interactive guidelines before deployment.

Key capabilities

• Enforces consistent styling and layout patterns specific to the Antigravity Kit design system.
• Generates responsive web structures that adapt seamlessly to various screen sizes.
• Provides rule-based validation for frontend code quality and adherence to best practices.
• Streamlines the creation of reusable UI components with built-in guideline compliance.

Example prompts

• "Generate a responsive navigation bar using the vudovn web design guidelines."
• "Refactor this legacy CSS block to comply with the Antigravity Kit color palette and spacing rules."
• "Create a landing page hero section that follows the established typography and layout standards from these guidelines."

Tips & gotchas

This skill is tightly coupled with the antigravity-kit repository; ensure your project context includes the necessary base configuration files for full functionality. While it enforces strict design consistency, you may need to manually override specific constraints if a unique business requirement conflicts with the standard guidelines.