skills.rest
Lrmdom
LrmdomCOMMUNITY
Explore all skills by this author →
GitHub

ui-review

Validate frontend code changes against Swiss Design System rules.

Updated Dec 17, 2025
Search Tags:#frontend#lint#design-system#style-guide#ui-review#swiss-design
One-click install
npx skills add https://github.com/Lrmdom/patrimonio-pwa --skill ui-review-lrmdom
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-review
Source: https://github.com/Lrmdom/patrimonio-pwa/tree/main/.windsurf/skills/ui-review
Command: npx skills add https://github.com/Lrmdom/patrimonio-pwa --skill ui-review-lrmdom

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Keeping frontend UI changes aligned with the Swiss International Style before committing, preventing visual drift and inconsistent design decisions.

Core Features & Use Cases

  • Automated checks that detect forbidden patterns (rounded corners, gradients, soft shadows, blur effects) in frontend code.
  • Manual review checklist covering colors, typography, borders, and spacing against the Swiss palette.
  • Use Case: before merging UI changes, run the review to ensure conformance with the design system and maintain visual consistency across the app.

Quick Start

Analyze the latest code changes with the UI Review Agent to verify design conformance before committing.

Frequently Asked Questions about ui-review

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

FAQPage Schema
How do I check frontend code for Swiss Design compliance before committing?▼

To check frontend code for Swiss Design compliance, analyze your latest changes against defined design tokens. The review enforces hard checks for colors, typography, borders, and spacing to prevent visual drift.

What UI patterns are flagged as forbidden during a design system audit?▼

During a design system audit, automated checks detect forbidden UI patterns including rounded corners, gradients, soft shadows, and blur effects to ensure strict alignment with the Swiss International Style.

How do I maintain UI consistency across frontend changes?▼

Maintain UI consistency by running a manual review checklist covering colors, typography, borders, and spacing. This validates that frontend changes align with the defined Swiss palette before merging.

Can I scope a UI review to just the apps/frontend directory?▼

Yes, you can scope a UI review to the apps/frontend directory. The review specifically targets frontend UI changes, code changes in that directory, and design-system compliance checks.

What's the best way to enforce hard style rules for design tokens?▼

The best way to enforce hard style rules for design tokens is to run an automated review before merging UI changes. This ensures color, typography, and borders strictly align with the defined Swiss Design System.

Related Skills

Explore More Design & Creative Skills→
dralgorhythmdralgorhythm
111

design-systems

Standardize UI components and design tokens across projects.

Community
Advanced
Saisagar7779Saisagar7779
4

ui-review

Review UI changes against the Swiss International Style design system.

Community
Intermediate
Enso-SoftEnso-Soft
1

android-conventions

Standardize Android/Kotlin naming, patterns, and code style conventions.

Community
Basic
srbhrsrbhr
28.1k

design-principles

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

Community
Basic