skills.rest
Adrian-opo
Adrian-opoCOMMUNITY
Explore all skills by this author →
GitHub

design-guide

Establish unified UI design standards for SwiftUI, Android, and web interfaces.

Updated Feb 25, 2026
Search Tags:#android#ui-design#swiftui#design-system#web#design-guide
One-click install
npx skills add https://github.com/Adrian-opo/multitool-app --skill design-guide-adrian-opo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-guide
Source: https://github.com/Adrian-opo/multitool-app/tree/main/.agents/skills/design-guide
Command: npx skills add https://github.com/Adrian-opo/multitool-app --skill design-guide-adrian-opo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Design inconsistencies across platforms (SwiftUI, Android, web) cause rework and visual drift; this guide provides a unified set of UI standards to ensure modern, professional interfaces and a single source of truth.

Core Features & Use Cases

  • Clean, minimal design with a single accent color, 8px grid spacing, strong typography hierarchy, and clear interactive states.
  • Bundled references with color palettes and component templates to accelerate UI implementation across platforms.
  • Use Case: Designers and developers apply the guide when building buttons, forms, cards, layouts, navigation, or full screens to maintain consistency.

Quick Start

Refer to the Design Guide before creating or updating any UI components.

Frequently Asked Questions about design-guide

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

FAQPage Schema
How do I maintain UI design consistency across SwiftUI, Android, and web platforms?▼

A unified multi-platform UI design system ensures consistency across SwiftUI, Android, and web interfaces by serving as a single source of truth for visual language. It enforces rules for color, spacing, typography, shadows, and interactive states.

What is included in a multi-platform UI design system for mobile and web?▼

A multi-platform UI design system includes bundled references with color palettes and component templates. It establishes standards for a clean, minimal design using a single accent color, 8px grid spacing, strong typography hierarchy, and clear interactive states.

How do I standardize buttons, forms, and cards across different platforms?▼

You can standardize buttons, forms, cards, layouts, and navigation by applying a unified UI design guide. It provides consistent component templates and visual rules to accelerate UI implementation and prevent visual drift across SwiftUI, Android, and web.

Does this UI design system work for both designers and developers?▼

Yes, designers and developers apply this guide when building buttons, forms, cards, layouts, navigation, or full screens. It bridges the gap by providing a shared single source of truth for visual language across all targeted platforms.

Why does visual drift happen in cross-platform app development?▼

Visual drift happens because design inconsistencies across SwiftUI, Android, and web platforms cause rework. Without a unified set of UI standards and a single source of truth, interfaces lose their modern, professional appearance and consistency over time.

Related Skills

Explore More Design & Creative Skills→
alissimorealissimore

ui-styling

Apply Nexus design system and Tailwind CSS tokens to UI components.

Community
Basic
tyk-labtyk-lab

design-guide

Document a cross-platform UI design system standardizing spacing, color, typography, and components.

Community
Advanced
arkcle83arkcle83

design-guide

Standardizes UI design across HTML, CSS, React, and other modern frameworks.

Community
Intermediate
Ankish8Ankish8

myoperator-design

Generate React/Tailwind UI code using the myOperator design system.

Community
Intermediate