Skill

scss

review, design, scaffold, refactor, and troubleshoot scss and sass based styling systems. use when the user asks for scss architecture, variables and tokens, mixins, nesting, partials, modules, theming, build integration, or migration guidance.

Install

npx claudepluginhub alisonaquinas/llm-web-design-skills

Tool Access

This skill uses the workspace's default tool permissions.

Preview

Use this skill to keep SCSS work grounded in maintainable architecture, predictable delivery, and framework-appropriate conventions.

Supporting Assets

agents/claude.yamlagents/openai.yamlreferences/best-practices.mdreferences/workflows.md

SKILL.md

Similar Skills

cache-components

Guides Next.js Cache Components and Partial Prerendering (PPR) with cacheComponents enabled. Implements 'use cache', cacheLife(), cacheTag(), revalidateTag(), static/dynamic optimization, and cache debugging.

cache-components

139.0k

claude-opus-4-5-migration

2 files

Migrates code, prompts, and API calls from Claude Sonnet 4.0/4.5 or Opus 4.1 to Opus 4.5, updating model strings on Anthropic, AWS, GCP, Azure platforms.

claude-opus-4-5-migration

83.2k

bmad-help

Analyzes BMad project state from catalog CSV, configs, artifacts, and query to recommend next skills or answer questions. Useful for help requests, 'what next', or starting BMad.

bmad-pro-skills

43.8k

Stats

Stars1

Forks0

Last CommitMar 16, 2026

Actions

View Source View Plugin View on GitHub View README

SCSS

Use this skill to keep SCSS work grounded in maintainable architecture, predictable delivery, and framework-appropriate conventions.

Intent Router

Need	Load
core conventions, structure, review priorities, and common red flags for SCSS	`references/best-practices.md`
setup, migration, testing, build, delivery, and day-two workflow guidance for SCSS	`references/workflows.md`

Quick Start

Confirm Sass compiler and module system, global styles, CSS modules, or scoped-style consumption model, design-token source, and runtime theming requirements.
Identify whether the task is greenfield scaffolding, incremental refactoring, troubleshooting, migration planning, or code review.
Apply the defaults in references/best-practices.md before proposing custom architecture.
Prefer the smallest change set that improves clarity, safety, operability, and long-term maintainability.

Workflow

start from token sources and entry-point stylesheets
flatten the highest-risk selectors first
keep compile-time and runtime theming responsibilities distinct
inspect compiled CSS and screenshots after structural changes

Typical Focus Areas

Sass compiler and module system
global styles, CSS modules, or scoped-style consumption model
design-token source
runtime theming requirements

Outputs to Prefer

summarize compiler, consumption model, and token posture first
group findings by modules, tokens, nesting, theming, and build integration
recommend architecture cleanup before cosmetic churn

First Response Pattern

restate the Sass module system, stylesheet consumption model, and runtime theming requirements before suggesting changes
anchor the plan at token sources, entry-point stylesheets, and the narrowest selector boundary
name the verification loop up front: Sass compile or host build, compiled CSS inspection, and a screenshot check of the affected page or component

Common Requests

Review this SCSS structure for module boundaries, nesting discipline, token usage, and override risk.

Help refactor a legacy Sass codebase into a more maintainable token and partial architecture.

Safety Notes

preserve externally visible behavior unless the user explicitly requests a redesign or a breaking change
avoid style-only churn when the current repository already has working conventions and automation