SkillHub

Skills

addyosmani

31 skills in 2 repos, most starred first.

addyosmani on GitHub

agent-skills Skill collection

Production-grade engineering skills: TDD, debugging, review, security, performance and ADRs.

114,200 stars on GitHub, Nov 9, 2026 · 25 skills · 1 bundle

  1. Addy's Agent Skills

    Bundle of 25 skills
    Use it when:
    You want your agent to follow a senior engineer's process at every phase, from a vague idea to a production launch.
    It does:
    Gives each phase its own skills: interview, spec, plan, build in tested slices, debug, review, simplify, secure, commit, document and ship.

    using-agent-skills, interview-me, idea-refine, spec-driven-development, constraint-driven-development, planning-and-task-breakdown, context-engineering, source-driven-development, incremental-implementation, frontend-ui-engineering, api-and-interface-design, observability-and-instrumentation, doubt-driven-development, test-driven-development, browser-testing-with-devtools, debugging-and-error-recovery, code-review-and-quality, code-simplification, security-and-hardening, performance-optimization, git-workflow-and-versioning, ci-cd-and-automation, documentation-and-adrs, deprecation-and-migration, shipping-and-launch

    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    83.5K
    top 14%
    Weekly Downloads
    5.1K
    top 10%

  2. code-review-and-quality

    Part of Addy's Agent Skills
    Use it when:
    A change, diff or pull request needs reviewing before it merges, whether you, another agent or a person wrote it.
    It does:
    Reads the tests first, walks each file for correctness, readability, architecture, security and performance, then checks how the author verified it.
    type:workfloweffect:noneneeds:nonecode-reviewcode-quality
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    83.5K
    top 14%
    Weekly Downloads
    5.1K
    top 10%

  3. security-and-hardening

    Part of Addy's Agent Skills
    Use it when:
    You build or audit anything that takes user input, handles logins, sessions or personal data, calls outside services, or adds a dependency.
    It does:
    Maps where untrusted data enters and what's worth stealing, asks the six STRIDE questions of each entry point, then applies hardening rules.
    type:workfloweffect:localneeds:nonesecurityprivacy
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    80.8K
    top 14%
    Weekly Downloads
    5K
    top 10%

  4. frontend-ui-engineering

    Part of Addy's Agent Skills
    Use it when:
    The agent builds or changes components, pages or layouts, and you want them to look designed rather than generated.
    It does:
    Gives rules for component structure, state, spacing, type, color, accessibility, responsive layout and loading states, with React and Tailwind examples.
    type:guidelineseffect:noneneeds:nonedesignaccessibilitydesign-systemanti-slopstack:reactstack:tailwind
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    77.3K
    top 14%
    Weekly Downloads
    4.7K
    top 11%

  5. performance-optimization

    Part of Addy's Agent Skills
    Use it when:
    Pages load slowly, Core Web Vitals miss their targets, an endpoint drags, or a change may have made things slower.
    It does:
    Measures a baseline, finds the actual bottleneck, fixes that one thing, re-measures the same way, then adds a guard against regression.
    type:workfloweffect:localneeds:noneperformancedatabasesverification
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    74.6K
    top 15%
    Weekly Downloads
    4.4K
    top 11%

  6. spec-driven-development

    Part of Addy's Agent Skills
    Use it when:
    You start a project, feature or significant change and nothing is written down yet about what to build.
    It does:
    Lists its assumptions for you to correct, asks clarifying questions, then writes a spec and ends its turn until you approve it.
    type:workfloweffect:localneeds:nonerequirementsplanning
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    74.1K
    top 15%
    Weekly Downloads
    4.4K
    top 12%

  7. documentation-and-adrs

    Part of Addy's Agent Skills
    Use it when:
    You make an architectural decision, change a public API, ship a feature, or keep explaining the same thing.
    It does:
    Has the agent write ADRs, short records of a decision with its context, rejected alternatives and consequences, plus docs that explain why.
    type:workfloweffect:localneeds:nonedocs-writingarchitecture
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    73K
    top 15%
    Weekly Downloads
    4.3K
    top 12%

  8. planning-and-task-breakdown

    Part of Addy's Agent Skills
    Use it when:
    You have a spec or clear requirements and need tasks an agent can implement, or a task feels too big to start.
    It does:
    Reads the spec and code without writing any, maps dependencies, slices the work into end-to-end features, then writes and orders the tasks.
    type:workfloweffect:localneeds:noneplanningscope-control
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    73K
    top 15%
    Weekly Downloads
    4.2K
    top 12%

  9. code-simplification

    Part of Addy's Agent Skills
    Use it when:
    Code works and tests pass, but it's harder to read or change than it should be.
    It does:
    Learns why the code is the way it is, spots deep nesting, long functions, vague names and dead code, then simplifies one change at a time.
    type:workfloweffect:localneeds:nonerefactoringcode-quality
    Age
    7 months
    Stars
    114K
    #16
    Total Downloads
    72.1K
    top 15%
    Weekly Downloads
    4.4K
    top 11%

  10. api-and-interface-design

    Part of Addy's Agent Skills
    Use it when:
    You design REST or GraphQL endpoints, module boundaries, component props or any interface other code depends on.
    It does:
    Applies rules such as Hyrum's Law: once enough people use an API, every behavior it shows, documented or not, is something to keep.
    type:guidelineseffect:noneneeds:nonearchitecturebackendstack:typescript
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    72K
    top 15%
    Weekly Downloads
    4.4K
    top 11%

  11. debugging-and-error-recovery

    Part of Addy's Agent Skills
    Use it when:
    A test fails, the build breaks, something that worked yesterday doesn't, or behavior doesn't match what you expected.
    It does:
    Halts new changes, keeps the evidence, then reproduces, finds the failing layer, shrinks the case, fixes the cause and verifies end to end.
    type:workfloweffect:localneeds:nonedebuggingtesting
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    71.9K
    top 15%
    Weekly Downloads
    4.3K
    top 12%

  12. test-driven-development

    Part of Addy's Agent Skills
    Use it when:
    The agent implements logic, fixes a bug or changes behavior, even when you didn't mention tests.
    It does:
    Finds how your repo runs tests, writes a test that fails, then the least code that passes, then refactors with the tests green.
    type:workfloweffect:localneeds:nonetddtesting
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    70.8K
    top 16%
    Weekly Downloads
    4.2K
    top 12%

  13. context-engineering

    Part of Addy's Agent Skills
    Use it when:
    You start a session or switch tasks, set up a project for an agent, or its output drifts from your conventions.
    It does:
    Layers context from a rules file such as CLAUDE.md down to the current error, loading only what the task needs.
    type:guidelineseffect:noneneeds:noneagent-workflowshandoff
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    70.6K
    top 16%
    Weekly Downloads
    4.3K
    top 12%

  14. incremental-implementation

    Part of Addy's Agent Skills
    Use it when:
    A feature or change touches more than one file, or the agent is about to write a lot of code at once.
    It does:
    Builds one small working piece, runs the tests and build, commits it, then moves to the next piece.
    type:workfloweffect:localneeds:noneimplementationscope-control
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    70.5K
    top 16%
    Weekly Downloads
    4.1K
    top 13%

  15. git-workflow-and-versioning

    Part of Addy's Agent Skills
    Use it when:
    The agent commits, branches, splits messy work into commits, opens a PR, writes a changelog entry or cuts a release.
    It does:
    Applies trunk-based habits: main always deployable, branches merged within one to three days, one logical change per commit.
    type:workfloweffect:remoteneeds:nonegitstack:git
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    68.3K
    top 16%
    Weekly Downloads
    4.2K
    top 12%

  16. idea-refine

    Part of Addy's Agent Skills
    Use it when:
    You have a rough concept and want to explore options and test its assumptions before committing to a plan.
    It does:
    Restates the idea as a "How might we" question, asks three to five questions, offers five to eight variations, then narrows to two or three directions.
    type:workfloweffect:localneeds:nonerequirementsplanning
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    67.9K
    top 16%
    Weekly Downloads
    4.1K
    top 13%

  17. using-agent-skills

    Only works as part of Addy's Agent Skills
    Use it when:
    You have this pack installed and want the agent to pick the right skill at the start of a session or a task.
    It does:
    Maps the task to a phase, from define to ship, and names the skill to use, or a sequence of skills for a whole feature.
    type:routereffect:noneneeds:noneskill-discoveryagent-workflows
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    67.5K
    top 16%
    Weekly Downloads
    4K
    top 14%

  18. browser-testing-with-devtools

    Part of Addy's Agent Skills
    Use it when:
    You build or debug anything that runs in a browser and want the agent to see what actually renders.
    It does:
    Reproduces the bug in Chrome, inspects console, DOM, styles, network and accessibility tree, fixes the source, then reloads and compares screenshots.
    type:workfloweffect:localneeds:mcpneeds:browsertestingdebuggingbrowser-automationstack:chrome-devtools
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    67.3K
    top 16%
    Weekly Downloads
    4.2K
    top 13%

  19. shipping-and-launch

    Part of Addy's Agent Skills
    Use it when:
    You're about to deploy to production and want to know what must be in place first.
    It does:
    Walks a pre-launch checklist across code quality, security, performance, accessibility, infrastructure and docs, then plans a staged rollout.
    type:guidelineseffect:noneneeds:nonedeploymentobservability
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    67K
    top 16%
    Weekly Downloads
    4.1K
    top 13%

  20. source-driven-development

    Part of Addy's Agent Skills
    Use it when:
    You want framework or library code that follows current documented practice instead of the agent's possibly outdated memory.
    It does:
    Reads your dependency files for exact versions, fetches the specific official doc page, writes code that follows it, then cites it.
    type:workfloweffect:localneeds:noneimplementationverificationresearch
    Age
    7 months
    Stars
    114K
    #16
    Total Downloads
    66.9K
    top 17%
    Weekly Downloads
    4.1K
    top 13%

  21. ci-cd-and-automation

    Part of Addy's Agent Skills
    Use it when:
    You set up or change a build and deploy pipeline, add automated checks, or a CI failure needs fixing.
    It does:
    Lays out a pipeline where every pull request passes lint, type check, unit tests, build, integration tests, optional end-to-end tests, an audit and a bundle-size check.
    type:guidelineseffect:noneneeds:nonecideploymentstack:github
    Age
    8 months
    Stars
    114K
    #16
    Total Downloads
    66.8K
    top 17%
    Weekly Downloads
    4.1K
    top 13%

  22. deprecation-and-migration

    Part of Addy's Agent Skills
    Use it when:
    You replace or sunset a system, API, library or feature, or rename or drop a database column in production.
    It does:
    Asks whether the old system still earns its keep, builds and documents the replacement, migrates each consumer, then removes the old code once usage is zero.
    type:workfloweffect:localneeds:nonemigrationdatabases
    Age
    7 months
    Stars
    114K
    #16
    Total Downloads
    65.9K
    top 17%
    Weekly Downloads
    4K
    top 14%

  23. interview-me

    Part of Addy's Agent Skills
    Use it when:
    An ask is underspecified, such as "build me a dashboard", or you say "interview me" or "grill me".
    It does:
    States its read of what you want with a confidence number, then asks one question at a time, each with its own guess for you to correct.
    type:workfloweffect:localneeds:noneinterviewrequirements
    Age
    5 months
    Stars
    114K
    #16
    Total Downloads
    65.9K
    top 17%
    Weekly Downloads
    4.1K
    top 13%

  24. doubt-driven-development

    Part of Addy's Agent Skills
    Use it when:
    Stakes are high, such as auth, security or an irreversible migration, or you're working in code you don't fully understand.
    It does:
    States the claim, hands only the code and its requirements to a subagent told to disprove it, then sorts each finding and fixes the real ones.
    type:workfloweffect:localneeds:subagentscode-reviewverificationmulti-agent
    Age
    6 months
    Stars
    114K
    #16
    Total Downloads
    65.3K
    top 17%
    Weekly Downloads
    4.1K
    top 13%

  25. observability-and-instrumentation

    Part of Addy's Agent Skills
    Use it when:
    You build anything that runs in production, add an endpoint, job or outside integration, or an incident was hard to diagnose.
    It does:
    Writes down what on-call will ask about the feature, adds the log, metric or trace that answers each question, then alerts with runbooks.
    type:workfloweffect:localneeds:noneobservabilitystack:opentelemetry
    Age
    4 months
    Stars
    114K
    #16
    Total Downloads
    63.3K
    top 17%
    Weekly Downloads
    4.1K
    top 13%

  26. constraint-driven-development

    Part of Addy's Agent Skills
    Use it when:
    No quality bar is written down, or an agent keeps skipping tests and silencing checks to get to green.
    It does:
    Detects your stack, asks four questions with defaults, writes CONSTRAINTS.md, installs a standard tool per dimension and places each check by cost.
    type:workfloweffect:localneeds:nonecode-qualityguardrailsci
    Age
    2 months
    Stars
    114K
    #16
    Total Downloads
    41.9K
    top 19%
    Weekly Downloads
    4K
    top 13%

web-quality-skills Skill collection

Agent Skills for optimizing web quality based on Lighthouse and Core Web Vitals.

3,058 stars on GitHub, Nov 9, 2026 · 6 skills · 1 bundle

  1. Web Quality Skills

    Bundle of 6 skills
    Use it when:
    You want a website checked and fixed for speed, accessibility, search and security, with measured evidence behind each finding.
    It does:
    Starts with web-quality-audit, one review across every area, then goes deep with one skill per area; each measures, fixes or recommends fixes, and measures again.

    web-quality-audit, performance, core-web-vitals, accessibility, seo, best-practices

    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    68.4K
    top 16%
    Weekly Downloads
    2.4K
    top 19%

  2. accessibility

    Part of Web Quality Skills
    Use it when:
    You want a web page or app checked and fixed against WCAG 2.2, the web accessibility standard.
    It does:
    Runs a Lighthouse audit, inspects the accessibility tree, tries the flow by keyboard, edits the code to fix what fails, then audits again.
    type:workfloweffect:localneeds:noneaccessibility
    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    68.4K
    top 16%
    Weekly Downloads
    2.4K
    top 19%

  3. seo

    Part of Web Quality Skills
    Use it when:
    You want a site's crawlability, page tags, structured data and mobile setup checked and fixed for search engines.
    It does:
    Runs Lighthouse's SEO and Agentic Browsing audits, checks what Lighthouse can't (headers, redirects, robots.txt, sitemap, canonicals), fixes the source and re-runs them.
    type:workfloweffect:localneeds:noneseo
    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    54.6K
    top 18%
    Weekly Downloads
    1.3K
    top 27%

  4. performance

    Part of Web Quality Skills
    Use it when:
    A site loads slowly or feels sluggish and you want it faster, with numbers to show it.
    It does:
    Sets a baseline from real-user Chrome data (CrUX) and a browser performance trace, changes only the code behind measured bottlenecks, then re-runs the same measurement.
    type:workfloweffect:localneeds:noneperformance
    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    43.6K
    top 19%
    Weekly Downloads
    1.2K
    top 28%

  5. web-quality-audit

    Only works as part of Web Quality Skills
    Use it when:
    You want one review of a site's quality across speed, accessibility, search, security and how well AI agents can use it.
    It does:
    Records a performance trace and runs Lighthouse audits, uses the failures to find the code responsible, then fixes or recommends fixes and re-runs the checks.
    type:workfloweffect:localneeds:noneperformanceaccessibilityseosecurity
    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    35.9K
    top 20%
    Weekly Downloads
    1.6K
    top 24%

  6. core-web-vitals

    Only works as part of Web Quality Skills
    Use it when:
    A page's Core Web Vitals fail: the main content appears late (LCP), clicks respond slowly (INP), or the layout jumps (CLS).
    It does:
    Checks real-user Chrome data at the 75th percentile, records a browser trace, reads only the insights for the failing metric, fixes the code behind it and re-measures.
    type:workfloweffect:localneeds:noneperformance
    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    34.3K
    top 20%
    Weekly Downloads
    1.2K
    top 27%

  7. best-practices

    Part of Web Quality Skills
    Use it when:
    You want a site checked and fixed for the security, compatibility and code-quality problems Lighthouse's Best Practices audit looks for.
    It does:
    Runs Lighthouse's Best Practices audit, inspects the console and network failures, checks dependencies, headers and config, fixes the code and re-runs the audit.
    type:workfloweffect:localneeds:nonesecuritycode-quality
    Age
    9 months
    Stars
    3.1K
    bottom 34%
    Total Downloads
    30.7K
    top 22%
    Weekly Downloads
    967
    top 29%