dialpad

Utility — Design skill for Claude Code

Design community

CSS utility class creation and updates.

How to install Utility

Installs to ~/.claude/skills/dialpad-dialtone-utility/SKILL.md

Terminal

mkdir -p ~/.claude/skills/dialpad-dialtone-utility && curl -fsSL https://raw.githubusercontent.com/dialpad/dialtone/HEAD/.claude/skills/utility.md -o ~/.claude/skills/dialpad-dialtone-utility/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Utility does

description: "CSS utility class creation and updates. Use when adding, modifying, or checking Dialtone CSS utilities (d-* classes). Covers Less file structure, token references, and verification."

CSS Utility Skill

Utility File Structure

Utilities live in packages/dialtone-css/lib/build/less/utilities/
Each .less file groups related utilities by CSS property type
Built with gulp: packages/dialtone-css/gulpfile.cjs
The output is a single monolithic CSS file (not tree

Alternatives in Design

Design Review Workflow — by Patrick Ellis - A tailored workflow for enabling automated UI/UX design review, including specialized sub a 3.7k ★
Brainwave — Learn to create modern websites with sleek parallax effects and bento box layouts 1.9k ★
Visual Content Pack — Visual content creation skills 1.6k ★