ChunUI is a SwiftUI design system with one brand colour and a fixed type scale

A palette with one colour in it

ChunUI is a SwiftUI design system extracted from a production iOS app called Zinner, and its stated premise is short: define your palette, ship the same texture.

The visual idea is a black and white grey scale with one brand colour, a monochrome quality, micro skeuomorphic buttons, native sheet standards, Metal shader effects and a dot matrix animation, packaged so it works out of the box.

The design philosophy section sets out four rules, and the first one explains the rest. There is a single colour: the grey scale carries all the hierarchy, and the brand colour is the only colour on the page, which the documentation calls the root of the shared quality.

The second is a three step type scale rule: the whole application has only three font sizes, sm at 13, base at 17 and lg at 24. The third is component level haptics and telemetry, with buttons carrying their own press feedback and a tracking hook so a host app can wire in its own analytics without touching the component internals. The fourth is configuration as code, where a single configure function is the only entry point for initialisation and a strings table can be overwritten wholesale for localisation.

The theme layer follows the same discipline. There is a semantic colour palette with names like background, card, panel, muted, accent and destructive, structured in the same way as shadcn, a font token set with the three sizes, spacing and corner radius tokens, and a motion token holding the global animation curves, with a reveal curve at zero overshoot and a wave curve with a small overshoot and staggered timing.

The practical consequence is that a developer picks a brand colour and the components dress themselves.

One configure call, and the whole family dresses itself

The usage example is short, and it shows the shape of the API.

import ChunUI

ChunUI.configure(colors: colors)

The pattern is that you build a colour set, the documentation calls the default Zinner black and white pink, then override the primary entry with your own hex value, call configure once at app start, and every component in the family afterwards picks up the new palette automatically. The documentation says the component family dresses itself automatically after that.

The components in the inventory are grouped by domain. Buttons are CCNeoButton with five variants and three sizes, async loading, and glow and shake press effects, plus a glass family of GlassButton, MetalGlassButton and GlassIconButton that use Liquid Glass on iOS 26 and degrade to a micro skeuomorphic equivalent below that.

There is a sheet standard, AppHelper.presentSheet with form, half, compact and picker variants, driving the native UISheetPresentationController with detents, a drag-down confirmation for a dirty state, a zoom anchor transition and bottom-anchored handling that swallows the safe area.

Feedback comes from a CCToastCenter with a single slot glass capsule toast, where a loading state takes over the top, and a bottom-anchored double capsule alert in a Twitter style that explicitly forbids UIAlert.

Then the effects layer, which is the largest single group: an aurora layer for AI working states built in Metal, a breathing dot matrix generating cover, a fractal floor of nine fractals, a sweep light transition, a particle dissolve, and a full set of holographic, meta balls, silk, beams and noise shaders. On top of that sits the ambient group, with a fluid gradient, a skeuomorphic AI orb with glow, particles and waves, a rainbow progress bar, a sweep light skeleton screen and streaming text that types itself out.

Forms, cards, icons and the plumbing underneath

The rest of the inventory is the ordinary work of an app, done to the same standard.

There is a form and card group: input, text area, toggle, checkbox and date picker controls, an Apple card with continuous corner radius and three levels of soft shadow, and two tag components, a cute tag and a keycap tag.

The icon group is worth singling out. PikaIcon is 1225 stroke template vectors at 24 by 24, distributed with the package, and they can be tinted and scaled. A thousand and a quarter icons shipped in the package means an app can use a consistent icon language without pulling in a separate asset pipeline, and the stroke template approach means they recolour with the theme rather than needing a dark and a light variant of every glyph.

The infrastructure group holds a progressive blur view, a page chrome pattern for floating page headers, camera and photo library pickers, an in-app browser and Markdown rendering.

That list is a good description of the scope. This is not a set of buttons; it is a design system that assumes you will need a sheet, a toast, a form, a card, an icon, a loading state and a link, and has already decided what each of those should look like.

The injection points for haptics, analytics and image loading

The library exposes a set of hooks that the host app can fill in, and the shape of them is what makes the design system extensible without forking it.

The host app fills in five hooks: a global haptics switch, a callback that fires when a sheet is presented, a component level click hook that the documentation describes as a wiring seat for a host tracking system with zero intrusion, a resolver that decides how a toast bubble is routed, and a custom image loader that takes over network image loading, with the example showing a closure that returns a Kingfisher view.

There is a global haptics switch, a hook that fires when a sheet is presented, a component level click hook that the documentation describes as a wiring seat for a host tracking system with zero intrusion, and a resolver that decides how a toast bubble is routed.

The image loader is the fifth: CCImageLoader.custom takes over network image loading, and the example shows a closure that returns a Kingfisher view, so a host app can bring its own image library and cache.

Every one of these is an assignment on a static property rather than a subclass or a protocol conformance you have to thread through the component tree. That is a small decision with a large effect: you can add haptics and analytics to a whole app without touching a single component, and the components stay ignorant of your stack.

The only third-party dependency is Pow, under the MIT licence, and it is what provides the button glow and shake press quality. Everything else is first party.

An agent skill that teaches the rules to a coding assistant

The repository ships a skills directory with a chunui subdirectory, and it is aimed at AI coding assistants rather than at people reading a tutorial.

The entry point is a SKILL.md with an architecture diagram, five rules for the quality, and the common mistakes. Beside it are three usage guides covering integration and skinning, the presentation layer with sheets, toasts, alerts and zoom, and the effects and animations, a components reference that documents every component by category, and an examples directory with five real production page sources, described as building block drawings, covering a profile page, a timeline, a checkout, an AI analysis card and a tab bar.

The installation differs by which assistant you use. For Claude Code the readme gives a project level copy, which it recommends, and a global copy, or a skills CLI install:

mkdir -p .claude/skills && cp -R /path/to/ChunUI/skills/chunui .claude/skills/
cp -R /path/to/ChunUI/skills/chunui ~/.claude/skills/
npx skills add liseami/ChunUI

For Codex and other agents you append the content of the skill file to the project AGENTS.md, or write a single line pointing at it. For Cursor you copy it into a cursor rules directory. After installation, the assistant will follow the component conventions and the architecture rules automatically in tasks that involve ChunUI.

That is a distinctive approach to a design system. Rather than documenting the API for humans, the project also documents it for a model that will write the code, which is arguably the more useful form now that a lot of app code is drafted by an assistant.

Installation, the gallery app, and the SwiftUI floor

Installation is through Swift Package Manager, and the requirement is stated as iOS 18.6 or newer.

.package(url: "https://github.com/liseami/ChunUI", branch: "main")

The version floor has a reason attached. On iOS 26 the system Liquid Glass is enabled automatically, and between 18.6 and 25 the same shapes degrade to a micro skeuomorphic equivalent. So the same component renders differently depending on the OS, and the library handles the fallback rather than the developer.

There is a gallery app. Example/ChunUIGallery.xcodeproj is a directly runnable component gallery, generated with xcodegen and referencing the local package, and it presents all the components and effects sectioned by Foundation, Controls, Feedback, Text, Effects, Ambient and Icons. The gallery source lives in Sources/ChunUIDemo and doubles as a compile level test of the public API surface, which is a neat way to make sure the examples cannot drift from the code.

The repository is MIT licensed, the last push was on 2026-10-13, and it publishes no GitHub releases. There is a CLAUDE.md at the root, a Package.resolved, a docs directory holding the screenshots, and an Example directory with a project.yml for the xcodegen setup.

The extracts-from-a-real-app framing is worth keeping in mind when you evaluate it. The components have been through a shipping product, which is why the details are specific, and it also means the conventions belong to one designer's taste, which is exactly the point of a design system and also its limit.

Editorial conclusion

Adopt ChunUI if you are building an iOS app and want a coherent monochrome look with a single brand colour, and you are happy to follow someone else's rules rather than design your own. Do not adopt it if your product needs a colourful interface, since the one brand colour rule is the foundation of the whole system. Before you add the package, check three things: your deployment target, since iOS 18.6 is the floor and the automatic Liquid Glass behaviour only applies from iOS 26, that you can live with exactly three font sizes, and whether the single third-party dependency Pow is acceptable, since it is what provides the button press effects.

Frequently asked questions

Official sources

1. Issues
2. License: MIT
3. liseami/ChunUI on GitHub
4. README