2,077 Open Skills

Free to get · One-click to use

✅ AI semantic search & keyword search
✅ Discussions & community interaction
✅ Version updates & multi-metric ranking
✅ Open SKILL.md standard

Import Skills

Composite Most Downloads Most Likes Most Comments Newest
paperclipai paperclipai
from GitHub Development & Coding
  • 📁 references/
  • 📄 SKILL.md
frontend design not

design-guide

Paperclip UI design system guide for building consistent, reusable frontend components. Use when creating new UI components, modifying existing ones, adding pages or features to the frontend, styling UI elements, or when you need to understand the design language and conventions. Covers: component creation, design tokens, typography, status/priority systems, composition patterns, and the /design-guide showcase page. Always use this skill alongside the frontend-design skill (for visual quality) and the web-design-guidelines skill (for web best practices). --- # Paperclip Design Guide Paperclip's UI is a professional-grade control plane — dense, keyboard-driven, dark-themed by default. Every pixel earns its place. **Always use with:** `frontend-design` (visual polish) and `web-design-guidelines` (web best practices). --- ## 1. Design Principles - **Dense but scannable.** Maximum information without clicks to reveal. Whitespace separates, not pads. - **Keyboard-first.** Global shortcuts (Cmd+K, C, [, ]). Power users rarely touch the mouse. - **Contextual, not modal.** Inline editing over dialog boxes. Dropdowns over page navigations. - **Dark theme default.** Neutral grays (OKLCH), not pure black. Accent colors for status/priority only. Text is the primary visual element. - **Component-driven.** Prefer reusable components that capture style conventions. Build at the right abstraction — not too granular, not too monolithic. --- ## 2. Tech Stack - **React 19** + **TypeScript** + **Vite** - **Tailwind CSS v4** with CSS variables (OKLCH color space) - **shadcn/ui** (new-york style, neutral base, CSS variables enabled) - **Radix UI** primitives (accessibility, focus management) - **Lucide React** icons (16px nav, 14px inline) - **class-variance-authority** (CVA) for component variants - **clsx + tailwind-merge** via `cn()` utility

⬇0 ❤11.8K 2天前 · 上传 Detail →
Jeffallan Jeffallan
from GitHub Databases & Storage
  • 📁 references/
  • 📄 SKILL.md
frontend angular performance

angular-architect

Generates Angular 17+ standalone components, configures advanced routing with lazy loading and guards, implements NgRx state management, applies RxJS patterns, and optimizes bundle performance. Use when building Angular 17+ applications with standalone components or signals, setting up NgRx stores, establishing RxJS reactive patterns, performance tuning, or writing Angular tests for enterprise apps.

⬇0 ❤5.2K 2天前 · 上传 Detail →
glitternetwork glitternetwork
from GitHub Development & Coding
  • 📄 README.md
  • 📄 SKILL.md
frontend devops files

pinme

This skill should be used when the user asks to "deploy", "upload", "publish", or "pin" any files, folders, frontend projects, or static websites to IPFS. Also activates when user mentions "pinme", "IPFS", or wants to share files via decentralized storage.

⬇0 ❤3K 2天前 · 上传 Detail →
LeoYeAI LeoYeAI
from GitHub Tools & Productivity
  • 📁 .github/
  • 📁 scripts/
  • 📁 skills/
  • 📄 CHANGELOG.md
  • 📄 LICENSE
  • 📄 README.de.md
automation database frontend

openclaw-master-skills

A curated index of 127+ high-quality OpenClaw skills sourced from the community — including skills for AI tools, productivity, marketing, frontend, mobile, backend, database, auth, DevOps, and web automation. Install individual skills via ClaWHub or clone the full collection from GitHub. Updated weekly by the MyClaw.ai team.

⬇0 ❤1.5K 7小时前 · 上传 Detail →
storybookjs storybookjs
from GitHub 数据与AI
  • 📁 references/
  • 📄 SKILL.md
expo storybook frontend

setup-react-native-storybook

Set up Storybook for React Native in Expo, React Native CLI, or Re.Pack projects. Use when adding Storybook to a project, configuring metro.config.js with withStorybook, creating .rnstorybook configuration files, setting up Storybook routes in Expo Router, configuring getStorybookUI, or adding the StorybookPlugin to a Re.Pack rspack/webpack config. Covers Expo, Expo Router, plain React Native CLI, and Re.Pack setups.

⬇0 ❤1.3K 1天前 · 上传 Detail →
cyxzdev cyxzdev
from GitHub Development & Coding
  • 📁 images/
  • 📄 README.md
  • 📄 SKILL.md
  • 📄 Uncodixfy.md
frontend generating code

uncodixfy

Prevents generic AI/Codex UI patterns when generating frontend code. Use this skill whenever generating HTML, CSS, React, Vue, Svelte, or any frontend UI code to enforce clean, human-designed aesthetics inspired by Linear, Raycast, Stripe, and GitHub instead of typical AI-generated UI.

⬇0 ❤1.1K 1天前 · 上传 Detail →
Castor6 Castor6
from GitHub Development & Coding
  • 📁 prompts/
  • 📁 scripts/
  • 📄 reference.md
  • 📄 SKILL.md
  • 📄 styles-mapping.json
frontend interface whenever

design-style

Use this skill whenever the user asks to build, create, design, develop, improve, or style any frontend interface or visual element.

⬇0 ❤200 2天前 · 上传 Detail →

Skill File Structure Sample (Reference)

skill-sample/
├─ SKILL.md              ⭐ Required: skill entry doc (purpose / usage / examples / deps)
├─ manifest.sample.json  ⭐ Recommended: machine-readable metadata (index / validation / autofill)
├─ LICENSE.sample        ⭐ Recommended: license & scope (open source / restriction / commercial)
├─ scripts/
│  └─ example-run.py     ✅ Runnable example script for quick verification
├─ assets/
│  ├─ example-formatting-guide.md  🧩 Output conventions: layout / structure / style
│  └─ example-template.tex         🧩 Templates: quickly generate standardized output
└─ references/           🧩 Knowledge base: methods / guides / best practices
   ├─ example-ref-structure.md     🧩 Structure reference
   ├─ example-ref-analysis.md      🧩 Analysis reference
   └─ example-ref-visuals.md       🧩 Visual reference

More Agent Skills specs Anthropic docs: https://agentskills.io/home

SKILL.md Requirements

├─ ⭐ Required: YAML Frontmatter (must be at top)
│  ├─ ⭐ name                 : unique skill name, follow naming convention
│  └─ ⭐ description          : include trigger keywords for matching
│
├─ ✅ Optional: Frontmatter extension fields
│  ├─ ✅ license              : license identifier
│  ├─ ✅ compatibility        : runtime constraints when needed
│  ├─ ✅ metadata             : key-value fields (author/version/source_url...)
│  └─ 🧩 allowed-tools        : tool whitelist (experimental)
│
└─ ✅ Recommended: Markdown body (progressive disclosure)
   ├─ ✅ Overview / Purpose
   ├─ ✅ When to use
   ├─ ✅ Step-by-step
   ├─ ✅ Inputs / Outputs
   ├─ ✅ Examples
   ├─ 🧩 Files & References
   ├─ 🧩 Edge cases
   ├─ 🧩 Troubleshooting
   └─ 🧩 Safety notes

Why SkillWink?

Skill files are scattered across GitHub and communities, difficult to search, and hard to evaluate. SkillWink organizes open-source skills into a searchable, filterable library you can directly download and use.

We provide AI semantic + keyword search, version updates, multi-metric ranking (downloads / likes / comments / updates), and open SKILL.md standards. You can also discuss usage and improvements on skill detail pages.

AI Semantic Search Keyword Search Version Updates Multi-Metric Ranking Open Standard Discussion

Quick Start:

Import/download skills (.zip/.skill), then place locally:

~/.claude/skills/ (Claude Code)

~/.codex/skills/ (Codex CLI)

One SKILL.md can be reused across tools.

FAQ

Everything you need to know: what skills are, how they work, how to find/import them, and how to contribute.

1. What are Agent Skills?

A skill is a reusable capability package, usually including SKILL.md (purpose/IO/how-to) and optional scripts/templates/examples.

Think of it as a plugin playbook + resource bundle for AI assistants/toolchains.

2. How do Skills work?

Skills use progressive disclosure: load brief metadata first, load full docs only when needed, then execute by guidance.

This keeps agents lightweight while preserving enough context for complex tasks.

3. How can I quickly find the right skill?

Use these three together:

  • Semantic search: describe your goal in natural language.
  • Multi-filtering: category/tag/author/language/license.
  • Sort by downloads/likes/comments/updated to find higher-quality skills.

4. Which import methods are supported?

  • Upload archive: .zip / .skill (recommended)
  • Upload skills folder
  • Import from GitHub repository

Note: file size for all methods should be within 10MB.

5. How to use in Claude / Codex?

Typical paths (may vary by local setup):

  • Claude Code：~/.claude/skills/
  • Codex CLI：~/.codex/skills/

One SKILL.md can usually be reused across tools.

6. Can one skill be shared across tools?

Yes. Most skills are standardized docs + assets, so they can be reused where format is supported.

Example: retrieval + writing + automation scripts as one workflow.

7. Are these skills safe to use?

Some skills come from public GitHub repositories and some are uploaded by SkillWink creators. Always review code before installing and own your security decisions.

8. Why does it not work after import?

Most common reasons:

  • Wrong folder path or nested one level too deep
  • Invalid/incomplete SKILL.md fields or format
  • Dependencies missing (Python/Node/CLI)
  • Tool has not reloaded skills yet

9. Does SkillWink include duplicates/low-quality skills?

We try to avoid that. Use ranking + comments to surface better skills:

  • Duplicate skills: compare differences (speed/stability/focus)
  • Low quality skills: regularly cleaned up