Skill UI

Comprehensive web and mobile design intelligence offering prioritized UX rules, 50+ styles, color palettes, typography pairings, and chart guidance to inform component design, accessibility checks, and landing/dashboard reviews.

This skill enforces a strict, opinionated baseline for UI development in Tailwind CSS projects. It ensures adherence to best practices concerning accessibility (ARIA), motion, typography, and layout structure. Use it when building complex UI components, reviewing CSS utilities, or preventing sloppy, generic interface design, especially when mitigating potential issues from AI-generated code.

A comprehensive skill for advanced text and typography handling within the Makepad framework. It provides robust mechanisms for font configuration, text layout management (Layouter), and high-quality GPU-based text rendering using Signed Distance Fields (SDF). Use this skill when needing to implement rich text displays, manage complex font styles, or ensure crisp, scalable typography across different resolutions.

This comprehensive guide outlines world-class product design principles, mimicking Apple's standard. It covers building robust design systems, defining essential design tokens (color, typography, spacing, motion), structuring UI components (atoms to organisms), optimizing UX flows, and designing engaging onboarding experiences. Ideal for product designers and PMs needing to establish a cohesive, scalable visual language and improve overall user experience.

This skill provides a comprehensive framework for designing and reviewing native iOS applications. It covers adherence to Apple's Human Interface Guidelines (HIG), ensuring consistency across layout, typography, safe areas, and system components (e.g., Dynamic Island). Use this when building or reviewing SwiftUI/UIKit code to guarantee the app feels intuitive, highly polished, and genuinely native to the Apple ecosystem.

This skill guides the creation of world-class, immersive web designs, aiming for Awwwards-level quality. It emphasizes intentional typography, purposeful motion, and sophisticated visual composition. Users can leverage the detailed scoring rubric (Typography, Composition, Motion, etc.) to review and elevate existing designs, ensuring every pixel is deliberate and performance-optimized.

This comprehensive guide provides principles for selecting, pairing, and implementing typefaces for optimal web readability. It covers advanced topics such as line height optimization, responsive typography, CSS implementation, and performance best practices. Use this when focusing on improving content legibility for long-form articles, dashboards, or general UI systems.

Guides frontend designer-engineers to deliver memorable, production-ready interfaces by defining an aesthetic stance, scoring feasibility with DFII, and translating every intentional decision into code, typography, motion, and texture.

This skill acts as a Visual Psychologist and Environmental Researcher, guiding the systematic mapping of visual elements—including color, typography, spacing, and imagery—to desired emotional states and conversion goals. It ensures that design decisions are strategic, supporting persuasion and brand narrative rather than merely being decorative. Use it when you need visuals to evoke a specific feeling (e.g., trust, urgency, calm) for a defined target audience, while respecting cultural and accessibility constraints.

Craft production-ready frontend pages, dashboards, or components with a clear visual point of view; focus on typography, color, motion, and layout so the experience feels intentional instead of generic.

A configuration-driven frontend approach that enforces premium UI rules, deterministic typography, responsive grids, and structured interaction states to override default LLM biases for polished interfaces.

Guides building production-ready user interfaces with thoughtful component architecture, consistent spacing, typography, color, and accessibility standards while avoiding generic AI aesthetics and over-configured patterns.