skills.rest
cchrisv
cchrisvCOMMUNITY
Explore all skills by this author →
GitHub

uplifting-components-to-slds2

Migrate Lightning Web Components from SLDS 1 to SLDS 2 with lint-guided fixes.

Updated Apr 19, 2026
Search Tags:#migration#lint#css-tokens#slds#lwc#uplift#ui-cleanup
One-click install
npx skills add https://github.com/cchrisv/professorFlowVisualPicker --skill uplifting-components-to-slds2
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: uplifting-components-to-slds2
Source: https://github.com/cchrisv/professorFlowVisualPicker/tree/main/.agents/skills/uplifting-components-to-slds2
Command: npx skills add https://github.com/cchrisv/professorFlowVisualPicker --skill uplifting-components-to-slds2

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Migrate Lightning Web Components from SLDS 1 to SLDS 2 by applying SLDS 2 linting guidelines and structured uplift steps. It guides users on how to address SLDS 2 styling hooks across color, spacing, typography, borders, radius, and shadows, including handling no-hardcoded-values, no-slds-class-overrides, and token migrations.

Core Features & Use Cases

  • SLDS 2 uplift: Migrate LWC components to SLDS 2 compliant styling with automatic lint-guided fixes.
  • Token migration guidance: Convert deprecated tokens to SLDS 2 styling hooks with safe fallbacks.
  • Validation and checklist: Ensure no hardcoded values and no SLDS class overrides in the migrated codebase.

Quick Start

Run a sample uplift against an LWC project to migrate SLDS 1 references to SLDS 2 hooks.

Frequently Asked Questions about uplifting-components-to-slds2

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate LWC components from SLDS 1 to SLDS 2?▼

Migrating LWC components from SLDS 1 to SLDS 2 involves applying lint-guided rules and structured steps to update deprecated classes and tokens to SLDS 2 styling hooks across color, spacing, and typography.

What is the best way to handle deprecated SLDS tokens during an uplift?▼

The best way to handle deprecated SLDS tokens during an uplift is to convert them to SLDS 2 styling hooks while applying safe fallback tokens to ensure compatibility across the migrated codebase.

How do I fix no-hardcoded-values and no-slds-class-overrides lint errors in LWC?▼

Fix no-hardcoded-values and no-slds-class-overrides lint errors by replacing hardcoded CSS values and class overrides with SLDS 2 styling hooks and fallback tokens during the LWC migration process.

Can I use lint-guided rules to automate SLDS 2 styling hook migration for borders and shadows?▼

Yes, you can use lint-guided rules to automate SLDS 2 styling hook migration for borders, radius, and shadows by applying structured migration steps that enforce SLDS 2 compatibility across your LWC project.

When do I need to migrate SLDS 1 styling hooks to SLDS 2 in my LWC project?▼

You need to migrate SLDS 1 styling hooks to SLDS 2 when your LWC project requires SLDS 2 compatibility across color, spacing, typography, borders, radius, and shadows to pass updated linting guidelines.

Related Skills

Explore More Software Engineering Skills→
sfdc-brendansfdc-brendan
15

sf-lwc-design

Create SLDS 2 compliant LWC components using --slds-g-* hooks.

Community
Advanced
forcedotcomforcedotcom
803

uplifting-components-to-slds2

Migrate LWC styling from SLDS 1 to SLDS 2 with hook-based replacements.

Official
Intermediate
angryracoonangryracoon

design-systems-slds2-migrate

Migrate Lightning Web Components from SLDS 1 to SLDS 2 styling.

Community
Advanced
padjeipadjei

design-systems-slds2-migrate

Migrate Lightning Web Components from SLDS 1 to SLDS 2 with linter checks and guidance.

Community
Advanced