Skills
.Work. You
Rest

mock-fidelity

Community

Deliver pixel-perfect UI from mockups.

Design & Creative#frontend#pixel-perfect#ui-implementation#design-token#mockup#visual-verification
Authorshakhovskiya-create
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Implementing UI from mockups often results in visuals that diverge in spacing, colors, and typography. This skill enforces pixel-equivalent output by systematic extraction and verification.

Core Features & Use Cases

  • Pixel-perfect frontend implementation from mockups (Figma, screenshots, or design references).
  • Design token extraction and application to components to ensure consistent visuals.
  • Use case: convert a provided mockup into production-ready UI across web apps with exact spacing, typography, and color matching.

Quick Start

Create a pixel-perfect frontend by translating the given mockup into production-ready UI.

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: mock-fidelity
Download link: https://github.com/shakhovskiya-create/shakhoff-claude-marketplace/archive/main.zip#mock-fidelity

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 510,000+ vetted skills library on demand.