Skills
.Work. You
Rest

zds-design-system

Community

Implement ZDS UI standards.

Design & Creative#ui#accessibility#frontend#design system#bootstrap#zds
Authorspallempati
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill ensures that UI development adheres to the Zelis Design System (ZDS) standards, maintaining consistency, accessibility, and a unified look and feel across the application.

Core Features & Use Cases

  • Component Styling: Provides guidance on using ZDS-approved classes for buttons, cards, forms, and tables.
  • Accessibility Compliance: Enforces WCAG 2.1 AA standards and proper ARIA attribute usage.
  • Layout & Spacing: Defines correct usage of Bootstrap grid utilities and ZDS spacing scale.
  • Use Case: When building a new feature, use this Skill to ensure all new UI components, like forms and buttons, are styled and implemented according to ZDS guidelines, including accessibility requirements.

Quick Start

Apply the Zelis Design System standards to the provided UI component code.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: zds-design-system
Download link: https://github.com/spallempati/AI-Studio/archive/main.zip#zds-design-system

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.