design-work

Name: design-work
Availability: InStock
Author: vipulj226-design

Enforce Wix design guidelines for layouts, typography, and accessibility.

Updated Mar 5, 2026

Search Tags:#typography #accessibility #ui-design #responsive-design #layout-patterns #design-guidelines #color-usage

Ready to run

npx skills add https://github.com/vipulj226-design/lordmahaveerabirthplace --skill design-work-vipulj226-design

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-work
Source: https://github.com/vipulj226-design/lordmahaveerabirthplace/tree/main/.emdash/skills/design-work
Command: npx skills add https://github.com/vipulj226-design/lordmahaveerabirthplace --skill design-work-vipulj226-design

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides comprehensive, production-ready design guidelines to ensure consistent Wix Vibe websites, reducing design drift and rework across teams.

Core Features & Use Cases

Establishes layout patterns, typography rules, color tokens, and accessibility considerations to guide designers and developers.
Enables rapid, consistent page and section design, hero sections, and responsive grids with reusable patterns.
Supports design reviews by documenting section variation principles, contrast requirements, and responsive behavior for real-world Wix pages.

Quick Start

Consult the design-work guidelines to apply the recommended patterns, typography, and accessibility rules to your Wix Vibe page designs.

Frequently Asked Questions about design-work

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I enforce consistent Wix design guidelines across UI components?▼

To enforce consistent Wix design guidelines, apply standardized typography scales, layout patterns, and color tokens across all pages and components. This ensures production-grade UI by satisfying documented rules for section variation, contrast, and responsive behavior.

What are the best layout patterns for responsive Wix Vibe websites?▼

The best layout patterns for responsive Wix Vibe websites utilize responsive grids and hero sections with built-in section variation principles. Applying these reusable layout patterns ensures rapid, consistent page design that adapts seamlessly across different screen sizes.

How do I check color contrast and accessibility for Wix typography scales?▼

To check color contrast and accessibility for Wix typography scales, apply contrast-focused styling rules using predefined color tokens. This process satisfies documented accessibility checks by ensuring text meets required contrast requirements across all UI components.

Can I use predefined color tokens to prevent design drift in Wix Vibe?▼

Yes, you can use predefined color tokens to prevent design drift in Wix Vibe. Establishing strict color token usage alongside documented layout variety and typography rules reduces rework by maintaining visual consistency across teams and pages.

When do I need to apply section variation principles in Wix UI design?▼

You need to apply section variation principles in Wix UI design whenever building multi-page layouts with repeating components like hero sections and responsive grids. This prevents visual monotony and satisfies production-grade design guidelines for diverse page structures.