SKILLEMALL.ai

BC design-style

Use this skill when the user asks to build, create, design, develop, or improve ANY frontend interface, web page, UI component, or visual element. This includes: - Building landing pages, websites, web apps, dashboards, portfolios, or any web interface - Creating UI components (buttons, forms, cards, navbars, modals, etc.) - Designing pages with React, Vue, Next.js, Svelte, or any frontend framework - Adding styling or improving visual design of existing components - Implementing specific design aesthetics (modern, dark, minimalist, brutalist, etc.) - User mentions "frontend", "UI", "UX", "design", "interface", "web design", or "styling" - User asks for "beautiful", "modern", "professional", "clean", or any aesthetic adjective - User requests help with CSS, Tailwind, styled-components, or any styling approach This skill automatically retrieves the appropriate design system prompt (Neo-brutalism, Modern Dark, Bauhaus, Cyberpunk, Material, etc.) to help create visually distinctive, production-grade frontend code instead of generic UI. IMPORTANT: Trigger this skill proactively for ANY frontend/UI work, not just when design style is explicitly mentioned.

modbender/skill-library-mcp Agent Skills author: modbender MIT 37 files · 2 scripts body ≈ 1 906 tokens Open the sourcegithub.com analyzed 3 d ago

This includes: - Building landing pages, websites, web apps, dashboards, portfolios, or any web interface - Creating UI components (buttons, forms, cards…

As a process C 61/100 · Has gaps — weak spots: result and completion, inputs and preconditions, running it twice

GeneratorSoftware developmentDesigntype and topics are labelled automatically from the skill text
JSON
Technical rating
B
83/100
safety, quality, tests
Safety 60%
100
Quality 40%
58
Run on models
none yet
Process rating
C
61/100
Has gaps
Result and completion w 14
0
Inputs and preconditions w 11
0
Progress reporting w 2
0
the three weakest of ten parameters · all ten

How to improve

  1. Shorten the description to 1024 characters.
For the model run — optional
  • Your own cases (evals/evals.json, 4–6 real requests with expected answers): the full check would then run those instead of a model-drafted suite.
  • A spec.yaml with trigger phrases and assertions — a behaviour contract for CI; `skilltest init` writes a template.

Guard findings · 0

✓ No critical or high findings

Files scanned: 37. Evidence is masked. Grey chips explain why severity was lowered.

Against the Agent Skills spec

  • error description-long description is 1171 chars, limit 1024

Process rating: all ten parameters 61/100

  • 0Result and completion. Does not say what the result is
  • 0Inputs and preconditions. Does not say what the process needs to start
  • 0Progress reporting. Says nothing while it works
  • 30Running it twice. 4 mutating operations with no state check
  • 60Steps. 91 steps, 5 vague phrases
  • 65Failures and branches. 3 branches
  • 100Tools and files. Tools declared in frontmatter
  • 100When it triggers. States when to use and when not to
  • 100Consistency. Name and required fields are in place
  • 100Execution cost. Instruction body is 1906 tokens

Everything here is measured from the skill text rather than judged by a model, so the numbers are checkable. A parameter weighs more when it is a more common reason for the process to stall.

Quality signals

  • +4Description does not say when NOT to use the skill (false activations)
  • +3Description length 1170: 120–800 characters recommended
  • +3Output format is not stated: the model decides each time
  • -32 of 2 scripts are never mentioned in SKILL.md
  • +1No license
  • +2Single-language instructions
  • +5Description quotes 8 example trigger phrases
  • +4Structure: 18 headings
  • +3Step-by-step instructions: 91 items
  • +4Has examples (4 code blocks)

Quality base 70; lint remarks subtract, signals add up to 100. Result: 58.