← All skill packs

UI Design & Development Skills

Skill pack
2 skills0 selected
reaginSkills in this pack

Use for React TypeScript file-structure work involving ownership or folders for new or moved files, multi-file components with narrow public entries, page and route separation, mirrored tests, path naming, import aliases, or directory-tree review. Trigger only when placement is unresolved or structure must change. Do not use for UI, logic, performance, security, upgrades, or debugging, or for code and tests whose path and structure are already established.

English

Generate, revise, or validate English Conventional Commit messages from Git repository changes, diffs, patches, file lists, or user-provided change summaries. Use when asked to draft a commit message, choose a commit type or scope, describe staged or unstaged work, add a breaking-change or issue footer, or split mixed changes into atomic commits. Inspect all uncommitted changes by default, but never stage files or create the commit.

English

Includes Frontend File Structure and Generate Commit Message.

Install with
Claude CodeCodexCursorGitHub CopilotGemini CLI

Supported by the Atlas install prompt. Skill-specific requirements vary.

Pack stats

Skills2CategorysecurityStars0

What’s included

Frontend File Structure

Use for React TypeScript file-structure work involving ownership or folders for new or moved files, multi-file components with narrow public entries, page and route separation, mirrored tests, path naming, import aliases, or directory-tree review. Trigger only when placement is unresolved or structure must change. Do not use for UI, logic, performance, security, upgrades, or debugging, or for code and tests whose path and structure are already established.

Generate Commit Message

Generate, revise, or validate English Conventional Commit messages from Git repository changes, diffs, patches, file lists, or user-provided change summaries. Use when asked to draft a commit message, choose a commit type or scope, describe staged or unstaged work, add a breaking-change or issue footer, or split mixed changes into atomic commits. Inspect all uncommitted changes by default, but never stage files or create the commit.

Quick start

  1. Choose your skills. Select individual skills above, or choose the entire pack.
  2. Copy the install prompt. Use Copy install prompt above the list.
  3. Send it to your agent. Paste into your coding agent’s chat. Your agent reviews the source and guides the setup.

Try it with your agent

After installation, start with a request like:

Example request
Use the Frontend File Structure skill to help with my task.
Ask me for the context you need before getting started.

Requirements & license

  • A coding agent that can access your project files and install skills.
  • Your agent checks each skill’s instructions, dependencies, and permissions during setup.
  • License details are not provided in these listings. Check the author’s terms before using the skills.
UI Design & Development Skills | Agent Skills Atlas