Vibekiller — Design skill for Claude Code

VibeKiller

**Kills the vibecoded look.** A Claude Code skill that stops your app from looking like a weekend prototype and makes it look like a well-funded company shipped it.

You know the look it kills: a pastel palette themed to whatever the app is about, grey text on grey backgrounds, one font weight everywhere, a hand-rolled tab bar, no empty state, and animations that ease instead of spring. It works. It looks cheap.

Everything in this skill is taken from apps that ship to hundreds of millions of people — **ChatGPT, X, and Apple's first-party apps** — plus **Apple's Human Interface Guidelines** for type, spacing, dimensions, corner radius, animation, and accessibility.

Claude Code writes a short design spec before touching any code, then implements it in React Native/Expo or SwiftUI against a fixed set of rules.

What it enforces

**Strict monochrome.** Pure `#000000` and `#FFFFFF` backgrounds regardless of what the app is about. A recipe app gets no warm greens; a finance app gets no trust-blue. One grey (`#1C1C1E` / `#F2F2F7`) is permitted for grouped list cards and text input fields. Full-width primary buttons are inverted fills, like X's Post button. The accent color appears on the floating action button, active tab indicators, links, and toggle on-states — nowhere else.

**Full-brightness text.** Body text, titles, and button labels are pure white or pure black — never grey. Grey is confined to timestamps, metadata, and placeholders, and never exceeds about a third of the text on screen. Weight carries hierarchy: Bold and Semibold for titles, Regular for body, and never Light or Thin. Washed-out grey text is the number one reason an app reads as cheap.

**Apple's dimensions.** San Francisco only, the iOS type scale with 17pt body, the 4/8pt spacing grid, 44pt minimum touch targets, and continuous corner radii from a fixed table — straight from the Human Interface Guidelines.

**System components over custom ones.** `TabView` and `NativeTabs` rathe