Vendora DS

VendoraHUB Design System Showcases is your complete interactive guide to the VendoraHUB Design System for SwiftUI. Browse, explore, and copy production-ready code for 50+ beautifully crafted components.

  EXPLORE THE DESIGN SYSTEM
  Navigate through a comprehensive library of SwiftUI components organized by category:

  • Design Tokens - Colors, typography, spacing, and more
  • Atoms - Basic building blocks like icons and text
  • Molecules - Buttons, text fields, badges, toggles
  • Organisms - Cards, list rows, empty states, forms
  • View Modifiers - Custom SwiftUI modifiers

  COPY CODE INSTANTLY
  Every component comes with ready-to-use Swift code. Simply tap to copy and paste directly into your Xcode project. No more searching documentation or guessing syntax.

  COMPONENT LIBRARY

  Buttons:
  • VHButton - Primary, secondary, ghost, destructive variants
  • VHIconButton - Icon-only buttons
  • Loading states and icon support

  Text Inputs:
  • VHTextField - Text inputs with labels and validation
  • VHCurrencyField - Formatted currency inputs
  • VHFormField - Complete form field with label

  Display Components:
  • VHCard - Cards with shadows and styling
  • VHListRow - Configurable list rows with icons
  • VHBadge - Status badges and indicators
  • VHQuickStat - Statistics display

  Feedback:
  • VHProgressBar - Progress indicators
  • VHEmptyState - Empty state views with actions
  • VHLoadingState - Loading indicators

  Controls:
  • VHToggle - Switch controls
  • VHChip - Selectable chips and tags

  DESIGN TOKENS
  Explore the complete token system:

  Colors:
  • Semantic colors (textPrimary, background, surface)
  • Brand colors (primary, secondary, accent)
  • Status colors (success, warning, error)
  • All colors adapt to Light and Dark mode

  Typography:
  • Display, headline, body, caption styles
  • Consistent font weights and sizes

  Spacing:
  • 4pt grid system
  • Semantic spacing tokens

  LIGHT & DARK MODE
  Preview every component in both Light and Dark appearances. See exactly how colors and styles adapt to the user's system preference.

  LIVE PREVIEWS
  Interactive previews show each component in action. See different states, variants, and configurations before copying the code.

  PERFECT FOR DEVELOPERS
  Whether you're building a new app with VendoraHUB Design System or maintaining an existing project, this app is your essential companion:

  • Quick reference while coding
  • Learn component APIs and usage patterns
  • Discover available variants and options
  • Copy code snippets without leaving your workflow

  ALWAYS UP TO DATE
  The showcase reflects the latest version of VendoraHUB Design System, ensuring you always have access to current components and APIs.

  Built with SwiftUI. Designed for developers.