Developer Resources & UI Kits
Developer Resources & UI Kits
Production-ready design systems and components for developers who want to ship quality UI without starting from scratch.
Built by a Developer, for Developers
I build apps. I know the pain of translating design to code, maintaining consistency, and iterating quickly. These resources bridge the gap between design tools and production code.
Who these are for:
- iOS/macOS indie developers shipping solo
- Small product teams without dedicated design resources
- Developers prototyping MVPs and side projects
- Teams wanting design-to-code consistency
Figma UI Kits
Component libraries with variants, proper naming, and developer handoff in mind.
iOS App UI Kit (SwiftUI-Ready)
What’s included:
- 80+ components with variants (buttons, inputs, cards, navigation)
- Light & dark mode support
- SF Symbols integration
- Responsive layouts (iPhone, iPad)
- Component documentation
- Design tokens (colors, typography, spacing)
Structure:
- Components organized by category
- Variant properties match SwiftUI modifiers
- Auto-layout for easy resizing
- Color styles mapped to semantic names
Best for: iOS apps built with SwiftUI
Format: Figma community file (free) + Premium version (expanded library)
Price: Free (basic) | $49 (premium with 200+ components)
View on Figma Community →
Purchase premium version →
Telehealth Dashboard UI Kit
Healthcare-specific interface components:
- Patient list views
- Appointment scheduling interfaces
- Video call controls
- Clinical notes templates
- Medication lists
- Vital signs displays
- HIPAA-compliant design patterns
Includes:
- 60+ healthcare-specific components
- Desktop and mobile layouts
- Accessibility-first design
- Privacy-aware patterns
- Sample flows (check-in, consultation, follow-up)
Best for: Healthcare apps, telemedicine platforms, clinical tools
Format: Figma file
Price: $89
Note: Design only—not medical advice or regulatory guidance
Icon System (200 Icons)
Consistent icon library for apps:
- 200 icons across 10 categories
- Multiple weights (regular, medium, bold)
- SF Symbols-style consistency
- Figma + SVG exports
- iOS, macOS, web-ready
Categories: Navigation, actions, media, communication, health, commerce, social, weather, devices, editing
Format: Figma components + SVG export
Price: $25
License: Unlimited projects (personal & commercial)
SwiftUI Components
Copy-paste code for common UI patterns, properly implemented.
SwiftUI Component Library (GitHub)
50+ reusable SwiftUI views:
- Custom buttons with loading states
- Form inputs with validation
- Card layouts and list items
- Empty states and placeholders
- Toast notifications
- Bottom sheets and modals
- Onboarding flows
- Settings screens
All components include:
- Clean, documented code
- Dark mode support
- Accessibility labels
- Preview providers
- Usage examples
Format: GitHub repository (MIT license)
Price: Free (open source)
SwiftUI Cookbook (Notion)
100+ code snippets organized by use case:
- Layout techniques
- Animation patterns
- Navigation solutions
- State management examples
- API integration templates
- Performance optimizations
Format: Notion template (duplicate to your workspace)
Price: $19
Includes: Regular updates with new snippets
Design Tokens & Systems
The bridge between design and code.
Design Token System (JSON + Swift)
Complete token system:
- Color palette (semantic naming: primary, secondary, success, error, etc.)
- Typography scale (SF Pro, New York)
- Spacing system (4pt grid)
- Border radius values
- Shadow definitions
- Breakpoints
Formats:
- JSON (for any platform)
- Swift enums (ready for SwiftUI)
- CSS variables (for web)
- Figma styles (synced)
Best for: Maintaining design consistency across platforms
Price: $35
Includes: Documentation + implementation guide
iOS Color System (Semantic + Adaptive)
Professional color system:
- 12 semantic color roles (background, foreground, accent, etc.)
- Light and dark mode variants
- Accessibility-compliant contrast ratios
- Figma color styles
- SwiftUI Color extension
What you get:
- Figma file with color system
- Swift file (Color+Theme.swift)
- Documentation explaining color roles
- Usage examples
Price: $15
App Templates
Complete app starting points, designed and coded.
SwiftUI Menu Bar App Template
Ready-to-ship macOS menu bar app:
- Menu bar icon with popover
- Settings window
- User preferences persistence
- Launch at login functionality
- Sparkle update integration (optional)
Includes:
- Complete Xcode project
- Figma design file
- Setup documentation
- App Store assets template
Best for: Productivity tools, system utilities, background apps
Price: $49
License: Single developer (unlimited apps)
Resources & Guides
Figma-to-SwiftUI Handbook
Comprehensive guide for translating designs to code:
- Design token workflow
- Component architecture
- Naming conventions that work in both tools
- Handoff best practices
- Common pitfalls and solutions
Format: PDF (80 pages) + Notion reference
Price: $29
Free Resources
Design System Starter Template (Figma)
Basic component library to kickstart your project.
SwiftUI Cheat Sheet (PDF)
Quick reference for common SwiftUI modifiers and patterns.
Custom Development & Design
Need something specific for your app or product?
What I Build:
- SwiftUI app development (macOS menu bar apps, iOS utilities)
- Custom UI component libraries (tailored to your design system)
- Figma-to-code translation (your designs, production-ready code)
- Design system creation (from concept to implementation)
Typical Projects:
- Menu bar apps (productivity, system tools)
- iOS app MVPs (side projects, validation)
- Component libraries (reusable across your products)
- Design-to-code consulting (bridging design and engineering)
Investment:
- SwiftUI component library: Starting at $1,500
- Menu bar app MVP: Starting at $2,500
- Complete design system: Starting at $3,000
- Hourly consulting: $150/hour (4-hour minimum)
Timeline: 2-4 weeks typical for component libraries, 4-6 weeks for full apps
Philosophy
Design systems should:
- Be easy to maintain (not overcomplicated)
- Translate directly to code (no lost-in-translation)
- Work in production (not just mockups)
- Respect platform conventions (feel native)
Code should:
- Be readable (clear names, good structure)
- Be reusable (DRY without over-abstraction)
- Be documented (comments where helpful)
- Be tested (in real apps, not just tutorials)
Everything here is built with these principles and used in actual shipped products.
Questions?
Pre-purchase questions: matt@mkhub.dev
Technical support: Included with all purchases
Custom work: Contact form →
Feature requests: Always open to suggestions for new components/tools