<Devsly/>
NotebookLM Watermark Remover
Remove the NotebookLM watermark from PDF slide exports — free, unlimited, and 100% in your browser.
View
NotebookLM Video Watermark Remover
Remove the NotebookLM watermark from every frame of your MP4 and auto-trim the end card — free and unlimited.
View
Gemini Watermark Remover
Remove the Gemini (Veo) sparkle watermark from every frame of your AI-generated MP4 — free and unlimited.
View
MCP https://devsly.io/mcp MCP Tools Best Skills API Docs

Keyboard Shortcuts

Navigation

Quick Search
⌘ / Ctrl + K
Toggle Dark Mode
⌘ / Ctrl + D
Close Dialogs
Esc

Tool Actions

Execute / Process
⌘ / Ctrl + Enter
Clear Input
⌘ / Ctrl + Shift + C
Copy Output
⌘ / Ctrl + Shift + X

Editor

Select All
⌘ / Ctrl + A
Undo
⌘ / Ctrl + Z
Redo
⌘ / Ctrl + Shift + Z

Updated 3mo ago

by julianoczkowski

designer-skills

A collection of agent skills for designers who prototype and build with AI coding tools. These skills encode design process so AI follows a structured path instead of producing random output.

588 GitHub stars (588)

+17 in 16 days

Stars gained per day · daily snapshots since Sep 30
Stars gained per day, Sep 30 to Oct 16: +17 in total; the busiest day was Oct 13 with +3 stars.Oct 1: +1 starsOct 2: 0 starsOct 3: 0 starsOct 4: +1 starsOct 5: +1 starsOct 6: +2 starsOct 7: 0 starsOct 8: 0 starsOct 9: +1 starsOct 10: +1 starsOct 11: +1 starsOct 12: +1 starsOct 13: +3 starsOct 14: +3 starsOct 15: 0 starsOct 16: +2 stars
Stars gained between daily snapshots
PeriodNew stars
Oct 1+1
Oct 20
Oct 30
Oct 4+1
Oct 5+1
Oct 6+2
Oct 70
Oct 80
Oct 9+1
Oct 10+1
Oct 11+1
Oct 12+1
Oct 13+3
Oct 14+3
Oct 150
Oct 16+2
  • 8 skills (8 skills found in its SKILL.md files)
  • 52 forks (52 forks)
  • 3mo ago last update (Last updated 3mo ago)

Install

Skills CLI

npx skills add julianoczkowski/designer-skills

Asks which skills and agents to install. Just one: npx skills add julianoczkowski/designer-skills --skill brief-to-tasks — add -g for every project.

Claude Code

git clone https://github.com/julianoczkowski/designer-skillscp -r "designer-skills/brief-to-tasks" ~/.claude/skills/

Copies the brief-to-tasks skill into ~/.claude/skills/ for every project (use .claude/skills/ for one project). Repeat for the other skills listed below.

Plugin

/plugin marketplace add julianoczkowski/designer-skills

Run inside Claude Code if the repository ships a plugin marketplace, then pick plugins from /plugin.

Skills can run code on your machine — read the SKILL.md first.

What it does

In the author's own words, from each skill's SKILL.md.

  • brief-to-tasks

    Break a design brief into an ordered checklist of independently buildable tasks using vertical slices. Saves as a markdown checklist. Use when user wants to break down work, create tasks from a brief, plan implementation order, or mentions "tasks" or "breakdown".

    brief-to-tasks/SKILL.md on GitHub (opens in a new tab)
  • design-brief

    Create a design brief through an interactive interview, codebase exploration, and experience design decisions. Saved as a markdown file in the project. Use when user wants to write a design brief, plan a new feature or page, define a UI direction, or mentions "brief".

    design-brief/SKILL.md on GitHub (opens in a new tab)
  • design-flow

    Run the full design-to-build workflow as a guided sequence. Orchestrates all designer skills in order, from grilling through review. Use when user wants to go through the complete design process, start a project from scratch, run the full flow, or mentions "design flow" or "full workflow".

    design-flow/SKILL.md on GitHub (opens in a new tab)
  • design-review

    Run a structured design critique against the brief and codebase. Checks visual hierarchy, consistency, responsiveness, accessibility, and aesthetic fidelity. Use when user wants a design review, critique, QA pass, polish pass, or mentions "review" after building.

    design-review/SKILL.md on GitHub (opens in a new tab)
  • design-tokens

    Generate a design tokens file (CSS variables or Tailwind config) based on a chosen aesthetic philosophy, with light and dark mode palettes, spacing scale, type ramp, and component-level tokens. Use when starting a new project, establishing a visual system, setting up tokens, or mentions "tokens" or "design system".

    design-tokens/SKILL.md on GitHub (opens in a new tab)
  • frontend-design

    Build distinctive, production-grade frontend interfaces with high design quality, guided by named aesthetic philosophies. Use when building components, pages, or applications. Generates working code with exceptional attention to aesthetic details and creative choices that avoid generic AI output.

    frontend-design/SKILL.md on GitHub (opens in a new tab)
  • grill-me

    Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, challenge an approach, or mentions "grill me".

    grill-me/SKILL.md on GitHub (opens in a new tab)
  • information-architecture

    Define the structural layer of a product or site before visual design begins. Covers navigation, content hierarchy, page structure, URL patterns, and user flows. Use when user wants to plan site structure, define navigation, map user flows, organize content, or mentions "IA" or "information architecture".

    information-architecture/SKILL.md on GitHub (opens in a new tab)

Review before you install

A skill is a set of instructions and scripts your agent will follow, and it can run code on your machine. Read the SKILL.md and any scripts first — this listing is not a security review.