Skill UI

A comprehensive design guide for creating ultra-compact, high-utility user interfaces. Ideal for professional tools, financial dashboards, or IDEs where information density is paramount. Principles include compact layouts, monospace typography, high contrast dark themes, and maximizing functional pixels while minimizing whitespace.

A comprehensive guide detailing the implementation of the Neo-Brutalist design aesthetic. It specifies core principles, including hard drop shadows, thick black outlines, and high-contrast flat colors. Includes detailed, platform-specific code examples for Web (CSS), SwiftUI, and Flutter, helping developers achieve a playful yet structured, high-impact UI look.

A comprehensive style guide and implementation toolkit for achieving authentic vintage aesthetics, inspired by 60s-80s retro design. It covers core principles like warm, muted color palettes, subtle noise textures, and classic typography pairings. Provides detailed code examples for Web (CSS), iOS (SwiftUI), and Android (Flutter) to recreate the analog, nostalgic feel in modern applications.

This guide details the principles and implementation techniques for Skeuomorphism—the design style that makes digital interfaces resemble real-world physical objects. It covers core principles like realistic textures (wood, leather), physical lighting, depth, and real-world metaphors. Provides detailed code examples for Web (CSS), iOS (SwiftUI), and Android (Flutter) to achieve highly realistic, tactile UI elements.

A comprehensive guide for implementing the raw, highly structured, and intentionally unfinished Brutalist aesthetic across web, mobile (SwiftUI, Flutter), and cross-platform applications. Learn to utilize stark borders, monospace fonts, high contrast colors, and system defaults to achieve a non-conventional, anti-polished design look.

A comprehensive guide to implementing Claymorphism, a playful and tactile UI/UX design trend. This style emphasizes soft, rounded shapes, inflated 3D volumes, and continuous curves, giving elements the look of soft clay or balloons. Learn the core principles, color palettes, and implementation techniques across CSS, SwiftUI, and Flutter.

A comprehensive guide for implementing the Glassmorphism aesthetic across web and mobile applications. Learn the core principles, including backdrop filtering, semi-transparent backgrounds, and light borders, to create a modern, frosted glass look inspired by macOS and contemporary digital interfaces. Includes code examples for CSS, SwiftUI, and Flutter.

This skill performs a comprehensive usability audit and heuristic evaluation of interactive user interfaces (UIs). It goes beyond mere visual aesthetics, assessing whether a system is intuitive, easy to learn, and functional for a first-time user. Use it when auditing complex tools, editors, or apps to ensure the user can complete primary tasks without needing extensive instructions or guidance.

Create highly aesthetic, animation-rich HTML presentations from scratch or convert existing PowerPoint files (PPT/PPTX). This tool focuses on generating distinctive, professional web decks with fixed 16:9 ratios. It supports low-density for keynote talks or high-density for detailed reports, ensuring visual impact and zero dependencies.

Use this powerful skill to perform advanced, multi-modal video generation and editing using the official google-genai SDK. Capabilities include generating realistic videos from text prompts (Text-to-Video), animating scenes from a single input image (First-Frame-to-Video), and applying style or character references from images. It also supports complex video refinement, inpainting, and optimizing source footage for professional creative workflows.

StyleSeed Design Review analyzes UI/frontend code (React/Tailwind/HTML) against a detailed design rubric. It scores the interface (0-100) across coherence, color discipline, hierarchy, and polish. The tool pinpoints specific violations—such as mixed corner radii or non-semantic colors—and generates a prioritized, actionable list of fixes, ensuring the final product looks professional and polished, not generic or 'AI-generated.'

This skill analyzes React, Tailwind, or HTML interfaces against a comprehensive design rubric (74 rules). It scores the UI from 0-100, identifying common flaws that make interfaces look generic, unfinished, or "AI-generated"—such as mixed corner radii, poor color discipline, or missing states. It provides a prioritized list of actionable fixes to ensure a polished, professional, and user-centric experience before deployment.