skills.rest
vultisig
vultisigOFFICIAL
Explore all skills by this author →
Website𝕏@vultisigGitHub

ui-components

Provides a design system and reusable UI components for iOS and macOS apps.

40|22|Updated Jan 28, 2024
Search Tags:#localization#ios#macos#design-system#ui-components#design-tokens
One-click install
npx skills add https://github.com/vultisig/vultisig-ios --skill ui-components-vultisig
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-components
Source: https://github.com/vultisig/vultisig-ios/tree/main/.claude/skills/ui-components
Command: npx skills add https://github.com/vultisig/vultisig-ios --skill ui-components-vultisig

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI teams struggle with inconsistent interfaces across screens and platforms. This Skill bundles a design system and reusable UI components (Screen, Toolbar, Sheet) and localization references to streamline development and maintain visual coherence.

Core Features & Use Cases

  • Central design system with documented color and typography tokens.
  • Reusable UI building blocks for Screens, CrossPlatformToolbar, CrossPlatformSheet, and common cells.
  • Localization guidance and reference materials to keep strings consistent across locales.

Quick Start

Start by applying the Theme color and font system, then compose a Screen with a Toolbar and Sheet using the provided UI components.

Frequently Asked Questions about ui-components

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

FAQPage Schema
How do I standardize UI components across iOS and macOS apps?▼

You can standardize UI components across iOS and macOS by applying a central design system with reusable building blocks like Screen, CrossPlatformToolbar, and CrossPlatformSheet to maintain visual coherence.

What is the best way to manage color and typography tokens for a cohesive design system?▼

Managing color and typography tokens requires a centralized design system with documented references. This Skill provides structured documentation for these tokens to keep visual elements consistent across your application.

How do I keep localization strings consistent across different locales in my app?▼

To keep localization strings consistent across locales, you can apply the localization guidance and reference materials bundled with this design system to ensure uniform text throughout your application.

Can I use cross-platform UI components for both iOS and macOS interfaces?▼

Yes, you can use cross-platform UI components for both iOS and macOS. The design system includes specific elements like CrossPlatformToolbar and CrossPlatformSheet designed for cohesive interfaces across both platforms.

How do I build a cohesive app screen using a reusable design system?▼

To build a cohesive app screen, start by applying the Theme color and font system, then compose your layout using the provided Screen component along with a Toolbar and Sheet.

Why does my UI look inconsistent across different app screens and platforms?▼

Your UI likely looks inconsistent because it lacks a central design system. Implementing standardized UI components and documented design tokens for color, typography, and layout resolves these visual discrepancies.

Related Skills

Explore More Design & Creative Skills→
wildbitcawildbitca
1

common-ui-design

Define UI aesthetic and design system tokens before frontend implementation.

Official
Advanced
AutisticAFAutisticAF
4

generators-localization-setup

Generate String Catalog and L10n infrastructure for iOS and macOS apps.

Community
Intermediate
AlterLab-IEUAlterLab-IEU
23

game-localization-manager

Coordinate game localization workflows across languages with i18n architecture and LQA processes.

Community
Advanced
derekhu0002derekhu0002

liquid-glass-design

Implement Liquid Glass UI patterns across SwiftUI, UIKit, and WidgetKit.

Community
Advanced