The macOS Liquid Glass aesthetic: cool grey-white ground, unified panels with hairline dividers, glass only on nav/overlays, grayscale body with a single blue accent.
Useful AI Skills
Curated Claude Code / AI agent skills, ready to install — design, development, content and productivity.
Install via the plugin marketplace or a .claude/skills folder in Claude Code.
Design20
Make AI output feel like it came from a professional designer.
Anthropic's official plugin: forces an aesthetic direction before coding, avoiding AI clichés (Inter font + purple gradients) and enforcing a unified color system.
Popular community skill (62k★): 240+ styles, 127 font pairings, 99 UX guidelines, auto-matched to product type.
Theme application from the official skills set: turns brand colors / design systems into CSS variables.
Official skill: layout-focused visual design with PNG / PDF export.
Community skill: 20 digital-design rules (usability, WCAG, readability thresholds) auto-applied to pages.
Official skill: codifies brand colors, type and tone into reusable design guidelines.
Derives a full OKLCH semantic light/dark token set from a single brand hue, outputting Tailwind v4 theme config.
Generate a structured landing page from product bullets: Hero/benefits/proof/FAQ/CTA, with copy following AIDA conversion logic.
Content-first: output semantic wireframes (headings/body/media/button placeholders) to lock the IA before any visual polish.
Produce a consistent SVG icon set on a shared grid: uniform stroke width, corner radius, caps and stroke alignment.
Ship a type scale (12/14/16/20/24/32…), weight, line-height and negative-tracking spec, tuned separately for CJK text.
Derive a full semantic palette from a brand color: accents/neutrals/status (success, warning, danger) plus light/dark, contrast-checked for WCAG.
Define states (hover/focus/disabled/loading) and sizes (sm/md/lg) for buttons, cards and forms, outputting a unified component spec with tokens.
Design restrained hover and transition motion for buttons/cards/overlays: consistent duration and easing (120ms tactile, 240ms layer), honoring reduced-motion.
Audit UI against WCAG 2.2: contrast, visible focus, aria/semantic labels and keyboard reachability, with a severity-ranked fix list.
Convert a light theme to dark correctly: no pure-black ground, desaturated surfaces, no pure-white text, with re-tuned contrast and glow.
Rework UI for narrow screens: fold nav into drawers/bottom bars, keep touch targets ≥44px, and optimize thumb zones for one-handed use.
Review UI against a checklist: hierarchy, spacing rhythm, consistency, usability and pixel detail, with an actionable fix per finding.
Use glass correctly: only where layers overlap (nav/overlays/sidebars), saturated colorful backdrop with backdrop-blur, and high-contrast foreground to avoid a muddy blur.
Development32
Skills for building, testing and reviewing code.
Official skill: build multi-file projects with React + Tailwind + shadcn/ui, then bundle into a single HTML.
Official skill: automated web testing — click, screenshot and validate rendered results.
Claude API / Anthropic SDK reference: model IDs, pricing, params, streaming, tool use, caching.
Code-review skill: reviews PRs or the working diff with actionable security, correctness and performance findings.
Security review of the working tree: injection, leaked secrets, vulnerable deps and unsafe defaults.
Reviews a GitHub PR or the working diff with ranked correctness, security and performance findings.
Generates a CLAUDE.md codebase doc so future AI sessions pick up project conventions quickly.
Launches and drives the current project to verify changes in a real running environment.
Microsoft's official browser automation: click, screenshot, read rendered DOM and measure Core Web Vitals.
Reads structured Figma design variables (colors, spacing, fonts) and turns them straight into code.
Browser console, network and performance debugging — pairs with Playwright for a develop-verify-debug loop.
Vercel v0 multi-screen UI prototyping: describe a need and get multi-screen interfaces and code.
Package what you do repeatedly into your own skill: generate SKILL.md and reference files to spec.
Operate GitHub directly: create issues, open PRs, review code and inspect repo state.
Capture web/desktop screenshots and read them back — for visual verification and docs.
The #1 community Claude Code skill framework: plan-first + TDD + subagent development, 260k+ stars.
An agent harness cataloging 100+ skills, memory and security tools — the entry point for Claude Code config.
Production-grade engineering skills (testing, refactoring, debugging), 200k+ stars — the pragmatic pick.
Claude Code behavior rules distilled from Karpathy's observations (single file) — among the most-starred single-file repos.
YC president Garry Tan's complete Claude Code config (23 tools + skills) — a copy-ready engineering template.
Read and write local files: list directories, read/write files, move and search files, letting Claude work directly with your project files.
Fetch web pages and convert them to text/Markdown so Claude can read online docs and pages.
Forces Claude to reason explicitly step by step and revisit its reasoning, reducing leaps when solving complex problems.
Knowledge-graph based long-term memory that remembers user preferences and project facts across sessions.
Operates Git directly: view status/diff/log, create branches, commit code, fitting into coding workflows.
Connects to PostgreSQL: inspect schemas, run queries, read and write data for analysis and reporting.
Works with Redis: read/write key-values, manage caches and queues, handy for debugging cache logic.
Official Docker MCP: manage containers, images and networks so Claude can run docker commands to maintain environments.
Manages Kubernetes clusters: inspect Pods/Deployments, troubleshoot services, and read logs.
Official HashiCorp server: generate and review Terraform configurations, manage infrastructure as code.
Official AWS MCP collection: query resources like S3/EC2/Lambda for cloud troubleshooting and deployment.
Official MongoDB MCP: CRUD documents, run aggregations, and analyze data.
Content Creation19
Creative pipelines for images, slicing and video production.
An AI agent skill that auto-produces talking-head videos: script → image gen → TTS → Whisper back-check → FFmpeg → captions.
A unified image-generation skill (FHL OpenAI-compatible API) for illustrations, icons, art and posters.
Batch UI slicing: extract icons, buttons and illustrations from a design, outputting pixel crops plus clean transparent PNGs.
Clone a voice from seconds to minutes of samples for dubbing (ElevenLabs / MiniMax / RVC).
Whisper transcription with word-level timestamps, aligned into SRT / burned-in captions.
Batch-generate video/social covers: pick imagery, add headline text, keep a consistent template.
Turn speech and audio into text: meetings, interviews and dictation with timestamps.
Turn podcast, video, or meeting transcripts into blog posts, tweets, newsletters and more — one source, many formats.
Generate an SEO writing brief with title, outline, H-structure, and internal/external link suggestions aligned to search intent.
Rapidly build a blog outline with clear information hierarchy and logical hooks, then expand section by section.
Batch-generate opening hooks in suspense, counterintuitive, and pain-point styles to lift completion rates.
Write persuasive copy with the Problem-Agitate-Solve framework, ready for landing pages, ads, and sales letters.
Generate ad copy variants for a target audience and channel, with headlines, subheads, and CTAs for A/B testing.
Design welcome, nurture, and win-back email sequences that move opens and conversions forward with deliberate pacing.
Distill show notes from audio transcripts: key takeaways, timestamps, and action items, ready to publish.
Write voiceover scripts with opening hooks, segment pacing, and CTAs, with word count to control runtime.
Adapt one piece of content into platform-fit captions for Douyin, Xiaohongshu, Weibo, and more, with hashtags and engagement prompts.
Turn brand personality into a tone-of-voice guideline so every piece of AI-generated copy sounds like one brand.
Write scene-by-scene dialogue for short videos, animation, and micro-dramas, with action and emotion cues for storyboards.
Productivity26
Automate your Claude Code environment and daily operations.
Configure the Claude Code harness: hooks, permissions, env vars and settings.json automation.
Run a prompt or command on a recurring interval — polling, scheduled jobs, repeated checks.
Customize Claude Code keyboard shortcuts, rebind keys and edit keybindings.json.
Reviews changes and applies reuse, simplification and efficiency cleanups — quality-focused, not bug-hunting.
Scans common read-only commands into an allowlist to reduce permission prompts for smoother long tasks.
Batch-translates project copy into multiple languages while preserving placeholders and format, outputting locale packs.
Structured brainstorming: diverge options, cluster them, then score against criteria to surface what you'd miss.
Turns a choice into a comparable decision matrix: weighted scoring across criteria, with a recommendation and reasoning.
Draft and rewrite emails by tone (formal / friendly / brief), handling multiple recipients and follow-up threads.
One-click key-point extraction from long text, video or audio into a structured summary plus action items.
Read and write Notion pages and databases: note-taking, knowledge bases and wiki lookups.
Query and create calendar events — let the AI schedule, find free time and set reminders.
Organize points into a mind map / outline structure, exportable as Markdown or Mermaid.
Cross-session persistent memory for Claude Code: compresses past sessions into searchable memory, 89k+ stars.
Read and write Jira/Confluence: query issues, create tasks, fetch docs — project management right in the chat.
Pull Sentry errors, issues and details so Claude can analyze production errors and suggest fixes.
Read and send Gmail: search emails, draft replies, tidy the inbox.
Official Twilio server: send SMS/WhatsApp, check message status — automate communications.
Email API: let Claude write and send transactional or marketing emails.
Official Stripe: check payments, create customers/subscriptions, debug billing — wire in e-commerce backends.
Manage Linear issues: create tasks, check status, update progress — handy for dev teams.
Read and write an Obsidian vault: take notes, create backlinks, organize your knowledge base.
Use Claude Code hooks to run checks automatically at key points — lint/tests before commits, permission guards — turning workflows into automation.
Define dedicated subagents (reviewer/tester/planner) so big tasks split in parallel with a main agent coordinating.
Wrap frequent operations into custom slash commands so one command kicks off a whole workflow.
Use session files and handoff summaries to resume work seamlessly in a new session, keeping context across sessions.
Data & Visualization21
Data analysis, charts and external data integration.
Required reading before any chart, dashboard or visualization: unified palette, light/dark themes, accessibility.
An MCP server that pulls live, up-to-date docs for any library, reducing API hallucination.
Scrapes structured web data, handling auth and anti-bot, exposed as Claude Code MCP tools.
Lets Claude query and operate a SQLite database directly for data exploration and reports.
Official document skills: parse PDF, Word, Excel and PowerPoint, extracting text, tables and structure.
Vision analysis: OCR text, recognize objects, and read charts and screenshots.
Multi-source deep web research: search, cross-verify and assemble a cited report.
The largest curated MCP server directory, 91k+ stars — browse tools and capabilities by category.
Autonomous deep-research agent: decompose → parallel search → cross-verify → cited report. The most mature deep-research tool.
Crawls entire websites into clean structured Markdown with search and change-detection, a heavyweight for turning web content into data.
An AI-optimized search API returning clean results with cited sources, ideal for RAG and research.
Neural semantic search that finds pages and related content by meaning, built for deep research.
A high-performance vector database to create collections, store embeddings, and run semantic retrieval as a RAG backend.
An embedded vector store for local knowledge bases with semantic search, lightweight and easy to use.
A production-grade vector database managing schemas and objects with hybrid search, built for real RAG systems.
Reads and writes Excel files directly — sheets, cells, formulas, and data cleanup.
A cloud scraping marketplace with thousands of ready-made actors for web, e-commerce, and social media data.
Fetches YouTube video transcripts to turn long videos into text for summaries, notes, and translation.
Searches the PubMed medical literature database for paper abstracts and citations for health research.
Headless browser automation that loads JavaScript pages, takes screenshots, and extracts rendered content.
Operates Google Drive — list files, search, and read/write documents to plug docs workflows into AI.