skills.rest
gaganpasupuleti
gaganpasupuletiCOMMUNITY
Explore all skills by this author →
GitHub

ui-review

Validate frontend UI code and CSS files for Swiss International Style design-system compliance using ripgrep.

Updated Mar 22, 2026
Search Tags:#design#ui#linting#frontend#compliance#swiss-style
One-click install
npx skills add https://github.com/gaganpasupuleti/Resume-Matcher --skill ui-review-gaganpasupuleti
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-review
Source: https://github.com/gaganpasupuleti/Resume-Matcher/tree/main/.github/skills/ui-review
Command: npx skills add https://github.com/gaganpasupuleti/Resume-Matcher --skill ui-review-gaganpasupuleti

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill prevents design drift and ensures frontend consistency by enforcing the strict Swiss International Style design system across the codebase.

Core Features & Use Cases

  • Automated Linting: Scans frontend files for forbidden UI patterns like rounded corners, gradients, and soft shadows.
  • Manual Compliance Checklist: Provides a structured review process for typography, color palettes, and component spacing.
  • Use Case: Before merging a pull request, use this Skill to verify that new UI components adhere to the hard-shadow and sharp-corner requirements of the project.

Quick Start

Run the ui-review skill to scan the current frontend directory for any design system violations.

Frequently Asked Questions about ui-review

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

FAQPage Schema
How do I lint frontend CSS for Swiss design compliance?▼

To lint frontend CSS for Swiss design compliance, scan component files to identify non-compliant styling patterns like rounded corners, gradients, and blur effects. This enforces strict Swiss International Style rules across your codebase.

What is Swiss International Style UI linting?▼

Swiss International Style UI linting is the process of validating frontend code against strict design system specifications. It targets CSS and component files to prevent design drift by identifying forbidden patterns like soft shadows and gradients.

Do I need ripgrep to scan frontend files for design violations?▼

Yes, you need ripgrep installed to scan frontend files for design violations. The tool requires ripgrep for efficient pattern matching when validating frontend UI code against the defined Swiss design system documentation.

Can I check frontend UI components for gradients and rounded corners before merging?▼

Yes, you can check frontend UI components for gradients and rounded corners before merging. Run a scan on your current frontend directory to verify new components adhere to hard-shadow and sharp-corner requirements before a pull request.

What's the best way to enforce hard-shadow and sharp-corner requirements in frontend code?▼

The best way to enforce hard-shadow and sharp-corner requirements in frontend code is using an automated linting scan against the Swiss International Style specifications. This identifies non-compliant patterns and provides a manual checklist for typography and spacing.

Related Skills

Explore More Design & Creative Skills→
srbhrsrbhr
28.1k

design-principles

Apply Swiss International Style guidelines to UI component design and visual tokens.

Community
Basic
WellApp-aiWellApp-ai
341

design-context

Align UI decisions with design system tokens, Storybook stories, and codebase patterns.

Official
Basic
LrmdomLrmdom

ui-review

Validate frontend code changes against Swiss Design System rules.

Community
Intermediate
amo-tech-aiamo-tech-ai

React Frontend Development

Develop React frontend components with TypeScript, Tailwind CSS, and shadcn/ui.

Community
Intermediate