agentsclimarketplace
Sign in

Design skill

Skill VinothKumar-Ganesan/Design-Skill/skills/design-skill

Use this skill for beginner designers with a guided, hands-on starter that scaffolds simple design projects (landing page, logo, mobile UI) and actionable checklists to learn the design process.From its SKILL.md

Install
npx -y skills add VinothKumar-Ganesan/Design-Skill --skill design-skill

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

  • no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
  • 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

SKILL.md

2.5 KB, 494 tokens by cl100k_base, as published. Nobody here has run it

Designing Skill — CLI Skill Definition

Name

Designing Skill — Node.js CLI Template Generator

Purpose

Provide beginner designers with a guided, hands-on starter that scaffolds simple design projects (landing page, logo, mobile UI) and actionable checklists to learn the design process.

Learning Objectives

  • Understand the basic design process: brief → sketch → prototype → iterate.
  • Produce an initial design brief and checklist for any small project.
  • Generate simple starter files you can open in a browser or a design tool and iterate from.

Audience

Beginners and non-designers who want a quick, structured way to start a design project.

Deliverables (generated)

  • design-brief.md — a concise project brief.
  • checklist.md — step-by-step actions to complete the starter.
  • Simple templates:
    • Landing page: index.html, styles.css.
    • Logo: logo.svg (placeholder).
    • Mobile UI: README.md with artboard suggestions.

Usage

  1. Open a terminal in the project folder (D:\DocumentViewerExtension\Design-Skill).
  2. Install dependencies:
npm install
  1. Run the CLI:
npm start
# or when installed globally: design-skill
  1. Follow prompts and open output/<name> to view generated files.

Commands (ssh-like summary)

  • npm install — install dependencies.
  • npm start — launch interactive generator.

How it teaches

Each generated template ships with a short design-brief.md and a checklist.md describing concrete next steps (sketches, iterations, exports). The CLI nudges learners to pick a primary color and name their concept so they practice creating a design brief.

Extensibility

To add new templates or update flows, edit index.js and add a new generator function following the existing patterns (generateLanding, generateLogo, generateMobile). Keep outputs under output/<name>.

Troubleshooting

  • If you see permission errors on Windows, run the terminal as Administrator or use a different output path.
  • If dependencies fail to install, ensure Node.js >=14 is installed.

Contribution

Add issues or pull requests to expand templates, improve checklists, or add automated exports (SVG/PNG) tooling.

What ships with it: 4 files

5.3 KB alongside SKILL.md, 1 of them executable

src/

Gives 0 of the 12 instructions most design frontend skills give in 494 tokens

Counted across 1,169 of the 1,878 authors here whose files we hold, read 2026-08-07

  • Use CSS variables for color consistencyin 72 of 1169, across 23 files
  • Commit to one bold aesthetic direction before codingin 72 of 1169, across 27 files
  • Match implementation complexity to the aesthetic visionin 70 of 1169, across 20 files
  • Add atmospheric background effects and texturesin 57 of 1169, across 9 files
  • Use unexpected spatial compositions and layoutsin 56 of 1169, across 8 files
  • Implement real working codein 55 of 1169, across 7 files
  • Vary themes and aesthetics across different designsin 48 of 1169, across 7 files
  • Launch chromium in headless modein 47 of 1169, across 4 files
  • Close the browser when donein 47 of 1169, across 4 files
  • Run provided scripts with help flag firstin 47 of 1169, across 4 files
  • Wait for network idle statein 47 of 1169, across 4 files
  • Use descriptive selectors for elementsin 47 of 1169, across 4 files

Grouped from the skills themselves: near-identical wordings counted once, and counted by distinct author, so one author publishing three of these counts once. Length counted with cl100k_base; the agent that loads this file may tokenize it differently.

Keep looking

Skills are one crate of 326,736. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.