skills

Skills

Claude Code skills for copywriting, advertising, SEO, design, and more.

Each skill is a self-contained markdown file that gives Claude deep domain knowledge. Drop one into your project and invoke it with a slash command.

Available Skills

Writing & Copy

Skill	Command	What it does
Ogilvy Copywriting	/ogilvy	David Ogilvy's advertising principles — positioning, headlines, promises, brand voice.
Copywriting	/copywriting	Write marketing copy that is clear, compelling, and drives action.
Copy Editing	/copy-editing	Systematically improve existing copy through focused editing passes.
Stop Slop	/stop-slop	Remove AI writing patterns from prose.

Design & Frontend

Skill	Command	What it does
Frontend Design	/frontend-design	Create distinctive, production-grade frontend interfaces.
Emil Design Eng	/emil-design-eng	Emil Kowalski's philosophy on UI polish and component design.
Apple Design	/apple-design	Apple's fluid, physical motion & interface design, translated for the web. Vendored from emilkowalski/skills.
Web Design Guidelines	/web-design-guidelines	Review UI code for Web Interface Guidelines compliance.
Vercel React Best Practices	/vercel-react-best-practices	React and Next.js performance optimization from Vercel.
App Store Screenshots	/app-store-screenshots	Generate App Store screenshots as advertisements with Next.js.
Impeccable	/impeccable	23-command design suite — craft, shape, critique, audit, polish, animate, colorize, and more. Vendored from pbakaus/impeccable under Apache-2.0 (see impeccable/NOTICE.md).
Stageshow	/stageshow	Faux product UI — stills and cursor-driven demos with a React kit, gold examples, and film/contact-sheet checks. Vendored from benjitaylor/skills @ ccb6a38 under MIT (see stageshow/LICENSE and stageshow/NOTICE.md — bundled app icons and brand marks keep their own terms).

Interface Domain Rules (better-*)

Six domain skills with clean, explicitly-declared boundaries, plus two orchestrators. Each domain owns its rules and hands off the rest — typography defers contrast to colors, accessibility defers remediation to colors, UI defers grouping to layout. Vendored from jakubkrehel/skills (see NOTICE-jakubkrehel.md).

Use these for rules with exact values. Use impeccable, apple-design, and emil-design-eng for taste and philosophy — they answer different questions and are meant to coexist.

Skill	Command	What it does
Better UI	/better-ui	Concentric radius math, shadow-as-border tokens, image outlines, icon cross-fades, theme-switch smear fix, press-scale values. Supersedes the old make-interfaces-feel-better.
Better Typography	/better-typography	Role-based type scale, properties over raw OpenType tags, measure, text-wrap, text-box-trim, the two iOS 16px input-zoom fixes.
Better Colors	/better-colors	APCA Lc thresholds with WCAG kept for conformance, ramp correctness, token grammar, oklab gradient interpolation. Reports rather than repaints.
Better Accessibility	/better-accessibility	WCAG 2.2 target sizes with the spacing exception, :focus-visible order, the 0.01ms reduced-motion switch, live-region decision list. Calibrated against false positives.
Better Layout	/better-layout	The 2× grouping rule, control clearance, container queries over media queries, logical properties, safe areas, full-bleed grid.
Better Writing	/better-writing	Tone by stakes, confirmation buttons that repeat the consequence, never concatenating around variables, error rewrites.
Better Interface	/better-interface	Orchestrator — routes a screen or flow to every domain above, consolidates one ranked verdict with a severity scale and finding cap.
Interface Review	/interface-review	Change-scoped review (uncommitted, branch, or PR). Reads the - side of hunks for regressions, expands blast radius, never mutates the tree. User-invoked only.

Visual Style & Web Design Craft

Audited subset of MengTo/Skills agent-skills/web-design/ (MIT), plus two skills written for this repo. Upstream ships 77 draft skills; 23 survived audit. Corrections and rejection rationale in NOTICE-mengto.md.

Skill	Command	What it does
Visual Style Presets	/visual-style-presets	Nine complete style directions (dark glass, dark technical, warm paper, editorial grid, archival book, wireframe…) — surface ladder, accent rule, signature motif. Replaces 19 upstream palette dumps.
Tailwind v4	/tailwind-v4	Tailwind v4 CSS-first config, @theme tokens, v3→v4 migration diffs, dynamic class safety.
Beautiful Shadows	/beautiful-shadows	Three exact layered elevation shadows. Copy-paste, no guessing.
Skeuomorphic UI	/skeuomorphic-ui	Tactile raised/pressed surfaces — gradient borders, stacked inset shadows, embossed text.
Glass Dark UI	/glass-dark-ui	Dark glassmorphism with readable contrast and masked gradient borders.
Container Lines	/container-lines	Vertical container guides + corner squares aligned to the real content container.
Framed Grid Layout	/framed-grid-layout	L-bracket corner frames via layered gradients — no extra markup.
Corner Diagonals	/corner-diagonals	Chamfered corners with correct clip-path math and inherited inner clipping.
CSS Border Gradient	/css-border-gradient	Gradient borders via double-background and masked pseudo-element.
Progressive Blur	/progressive-blur	Layered backdrop-blur gradient ladder with WebKit fallbacks.
Mesh Gradient Dark Blue	/mesh-gradient-dark-blue-clean	Procedural dark-navy mesh atmosphere with a full system recipe.
Liquid Metal Border	/liquid-metal-border	Animated metallic borders via metal-fx.
Beam Glow States	/beam-glow-states	Border-beam loading/active/error states with a11y-safe framing.
Reveal Hover Effect	/reveal-hover-effect	Cursor-masked reveal — correct dual masks, settle-then-stop rAF, cold-load handling.
Staggered Word Reveal	/staggered-word-reveal	Dependency-free word-split reveal with aria-label and reduced-motion.
WebGL Laser	/webgl-laser	Raw-WebGL volumetric laser beam — thin core, wide halo, FBM fog.
Thinking Orbs	/thinking-orbs	Animated AI thinking-state orbs with correct state/preset mapping.
Shaders Cursor Ripples	/shaders-cursor-ripples	Cursor ripple shader over imagery. ⚠️ Paid, non-OSS dependency.

Image Generation

Skill	Command	What it does
Minimal Zine Poster	/minimal-zine-poster	Compile a theme into a quiet Japanese/Korean zine poster — aged paper, huge negative space, one high-chroma anchor — and generate the image. Needs GEMINI_API_KEY. Adapted from LiamGvchi/gc-minimal-zine-poster under MIT (see NOTICE-liamgvchi.md).

Page Types & Product IA

Skill	Command	What it does
Landing Page	/landing-page	Single-intent landing page IA, layout archetypes, headline formulas, indexing rules.
Pricing Page	/pricing-page	Value-metric-first pricing IA, plan ceilings, feature grouping, mobile rules.
Product Proof SaaS	/product-proof-saas	Honest AI-product demos — real state models, no faked generation speed.
Operational Enterprise AI	/operational-enterprise-ai	Enterprise-buyer IA — permissions, approval, audit, rollback as a data model.
Documentary Brutalist Agency	/documentary-brutalist-agency	Editorial agency site — capped parallax, DOM-order rules, real a11y constraints.
Editorial Portfolio Chapters	/editorial-portfolio-chapters	Chaptered portfolio with exact grid, easing, and stagger values.
Service Booking Flow	/service-booking-flow	Appointment booking resilience — slot confirmation, stale slots, payment failure, focus return.

SEO & Marketing

Skill	Command	What it does
SEO Audit	/seo-audit	Identify SEO issues and provide actionable recommendations.
Schema Markup	/schema-markup	Implement schema.org markup for rich search results.
Programmatic SEO	/programmatic-seo	Build SEO-optimized pages at scale using templates and data.
Content Strategy	/content-strategy	Plan content that drives traffic, builds authority, and generates leads.
Competitor Alternatives	/competitor-alternatives	Create competitor comparison pages for SEO and sales enablement.
Page CRO	/page-cro	Analyze marketing pages and improve conversion rates.
Analytics Tracking	/analytics-tracking	Set up tracking that provides actionable insights.

Video — HyperFrames

Skills for HyperFrames by HeyGen — write HTML, render video. Vendored from heygen-com/hyperframes under Apache-2.0 (see LICENSE-hyperframes).

Skill	Command	What it does
HyperFrames	/hyperframes	Author HTML video compositions, timelines, captions, voiceovers, transitions.
HyperFrames CLI	/hyperframes-cli	Dev loop: init, lint, inspect, preview, render, doctor.
HyperFrames Media	/hyperframes-media	Asset preprocessing — TTS, transcription, background removal.
HyperFrames Registry	/hyperframes-registry	Install registry blocks and components into compositions.
Website to HyperFrames	/website-to-hyperframes	Capture a website and turn it into a video composition.
Remotion to HyperFrames	/remotion-to-hyperframes	Port an existing Remotion project to HyperFrames.
Contribute Catalog	/contribute-catalog	Author and submit a new HyperFrames registry block or component.
GSAP	/gsap	GSAP timelines, easing, stagger inside HyperFrames.
Anime.js	/animejs	Anime.js adapter patterns for HyperFrames.
WAAPI	/waapi	Web Animations API adapter patterns for HyperFrames.
CSS Animations	/css-animations	Seek-deterministic CSS keyframes for HyperFrames.
Lottie	/lottie	Lottie and dotLottie inside HyperFrames.
Three.js	/three	Three.js / WebGL canvas layers driven by hf-seek.
TypeGPU	/typegpu	TypeGPU and raw WebGPU shader effects for HyperFrames.
Tailwind	/tailwind	Tailwind v4 browser-runtime patterns for HyperFrames.

Performance & Architecture

Vendored from brotzky/performance-skills via performance.dev/skills.

Skill	Command	What it does
Conductor Rewrite Performance	/conductor-rewrite-performance	Optimize local-first React desktop apps — taming re-render cascades, slow streaming lists, and profiling Tauri without DevTools.
Linear Local-First Architecture	/linear-local-first-architecture	Make web apps feel instant — local-first sync, optimistic updates, eliminating spinners and perceived latency.

Code Review & Engineering

Skill	Command	What it does
Adversarial Review	/adversarial-review	Review a diff like a skeptic — assume it's broken, try to break it, and only report findings that survive an independent refutation pass. Scales from one inline pass to a multi-agent fan-out (one skeptic per domain → adversarial verify → synthesis).

Install

Copy a skill to your global Claude Code skills directory:

# Install a single skill (e.g., ogilvy)
mkdir -p ~/.claude/skills/ogilvy
curl -o ~/.claude/skills/ogilvy/SKILL.md \
  https://raw.githubusercontent.com/boraoztunc/skills/main/ogilvy/SKILL.md

Some skills have extra reference files. To get everything:

# Clone the repo and symlink what you need
git clone https://github.com/boraoztunc/skills.git
ln -s $(pwd)/skills/ogilvy ~/.claude/skills/ogilvy

How Skills Work

A skill is a SKILL.md file with YAML frontmatter (name, description) and markdown body. Claude Code loads it automatically when you invoke the slash command. The description tells Claude when to activate the skill — write it like a trigger condition, not a summary.

License

MIT