skills.rest
deomiarn
deomiarnCOMMUNITY
Explore all skills by this author →
GitHub

remove-inline-styles

Remove inline typography utilities from shadcnblocks headings and enforce h1–h3 hierarchy.

Updated Nov 18, 2025
Search Tags:#typography#accessibility#cleanup#heading-hierarchy#css-cleanup
One-click install
npx skills add https://github.com/deomiarn/website-template --skill remove-inline-styles
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: remove-inline-styles
Source: https://github.com/deomiarn/website-template/tree/main/.claude/skills/remove-inline-styles
Command: npx skills add https://github.com/deomiarn/website-template --skill remove-inline-styles

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Removes inline typography styles from shadcnblocks and fixes heading hierarchy to ensure consistent, accessible typography.

Core Features & Use Cases

  • Inline Style Cleanup: Remove text size/weight/tracking/leading from headings.
  • Hierarchy Enforcement: Enforce h1 only for hero, h2/h3 for sections in sequence.
  • Wrapper Structure: Add max-w-3xl mb-10 wrappers around section headers.

Quick Start

Refactor section components to remove inline classes and apply the standard wrapper + heading structure.

Frequently Asked Questions about remove-inline-styles

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

FAQPage Schema
How do I remove inline typography styles from heading elements?▼

Remove inline typography styles by stripping text size, font weight, tracking, and line-height classes from headings while preserving layout, spacing, and color utilities. This Skill automates cleanup of text-*, font-*, tracking-*, and leading-* classes across h1–h6 elements to enforce consistent, accessible typography.

What's the best way to fix heading hierarchy across page sections?▼

Enforce a single h1 per page and maintain strict h1→h2→h3 order across sections. This Skill automatically corrects heading hierarchy violations and adds max-w-3xl mb-10 wrapper structures around section headers to standardize layout.

Can I clean up rounded utilities and button styles from non-button elements?▼

Yes. This Skill strips most rounded utilities and button-specific styles from non-button elements while preserving approved layout, spacing, color, and border utilities to maintain structural integrity.

When should I use heading hierarchy cleanup in my design workflow?▼

Apply this after installing shadcnblocks sections during post-install cleanup. It targets accessibility and consistency concerns, ensuring heading structure and typography align with semantic HTML standards and WCAG guidelines.

Do I need to manually refactor each heading or does this automate the process?▼

This Skill automates refactoring by detecting and correcting hierarchy violations, removing inline typography utilities, and applying standard wrapper structures across all section components in a single operation.

Related Skills

Explore More Design & Creative Skills→
nilecuinilecui
27

using-shadcn-ui

Integrate shadcn/ui components and shadcnblocks.com blocks into React projects.

Community
Intermediate
89jobrien89jobrien
4

web-accessibility

Audit web content for WCAG 2.1/2.2 conformance and accessibility issues.

Community
Advanced
JeroenJochemsJeroenJochems

tailwindcss-development

Style web applications using Tailwind CSS v4 utilities and CSS-first configuration.

Community
Intermediate
FatByFatBy
2

merge-pr

Merge GitHub pull requests after validating required checks and pinning the head commit.

Community
Advanced