jamesrochabrun

ClaudeCodeUI — Design skill for Claude Code

Design community

UI Package to build macOS apps for Claude code.

How to install ClaudeCodeUI

This entry records only its repository, not the path inside it, so there is no exact command to give. Open jamesrochabrun/ClaudeCodeUI and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What ClaudeCodeUI does

UI Package to build macOS apps for Claude code.

Alternatives in Design

Clui Cc — A lightweight, transparent desktop overlay for Claude Code on macOS 956 ★
App Onboarding Questionnaire — A Claude Code skill that designs and builds high-converting questionnaire-style app onboarding flows — modelle 751 ★
Makepad Skills — Makepad UI development skills for Rust apps: setup, patterns, shaders, packaging, and troubleshooting 723 ★

README

ClaudeCodeUI

**A Swift Package library for integrating Claude Code UI into your macOS apps.**

ClaudeCodeUI is a dependency-only library that provides a beautiful, native macOS graphical interface for Claude Code conversations. It is designed to be integrated directly into your own macOS applications as a Swift Package — it is not distributed as a standalone app.

⚠️ **Note**: This is not an official Anthropic product.

Features

🎨 Native macOS Design - Beautiful SwiftUI interface that feels right at home on macOS
💬 Full Chat Interface - Complete conversation management with message history
📎 File Attachments - Support for images, PDFs, and other file types
🎯 Code Selections - Display and manage code snippets within conversations
🗂️ Session Management - Built-in session picker and persistence
🎨 Theming - Automatic dark/light mode support
⚡ Real-time Streaming - Live response streaming with token usage tracking
🛠️ Tool Integration - Full support for Claude's tool use capabilities
🔧 MCP Support - Model Context Protocol server integration

Installation

Integrate ClaudeCodeUI into your macOS app:

Swift Package Manager

Add ClaudeCodeUI to your project through Xcode:

File → Add Package Dependencies
Enter: https://github.com/jamesrochabrun/ClaudeCodeUI
Select "Up to Next Major Version" with 1.0.0

Or add it to your `Package.swift`:

dependencies: [
    .package(url: "https://github.com/jamesrochabrun/ClaudeCodeUI", from: "1.0.0")
]

Important: ApprovalMCPServer for Package Consumers

When using ClaudeCodeUI as a package dependency, you need to build and provide the ApprovalMCPServer separately for security reasons:

Add the ApprovalMCPServer dependency:

dependencies: [
    .package(url: "https://github.com/jamesrochabrun/ClaudeCodeUI", from: "1.0.0"),
    .package(url: "https://github.com/jamesrochabrun/ClaudeCodeApprovalServer",