skills.rest
crewrig
crewrigOFFICIAL
Explore all skills by this author →
WebsiteGitHub

frontend

Review markup and styles for semantic HTML, WCAG 2.1 AA accessibility, and Core Web Vitals.

20|4|Updated May 14, 2026
Search Tags:#performance#html#accessibility#frontend#css#tailwind
One-click install
npx skills add https://github.com/crewrig/crewrig --skill frontend-crewrig
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend
Source: https://github.com/crewrig/crewrig/tree/main/artifacts/core/skills/frontend
Command: npx skills add https://github.com/crewrig/crewrig --skill frontend-crewrig

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill gives you a practical, framework-agnostic frontend reference so you can build and review user interfaces with correct semantics, accessible interactions, stable layout behavior, and solid performance habits.

Core Features & Use Cases

  • HTML and semantics guidance: Choose the right landmarks, headings, labels, and form patterns so pages work better for users and assistive technology.
  • CSS and design token strategy: Apply custom properties, layering, logical properties, container queries, and a clean token taxonomy for maintainable theming.
  • Accessibility and performance review: Check WCAG 2.1 AA basics, focus management, contrast, touch targets, Core Web Vitals, font loading, image sizing, and script loading.
  • Use case: Review a landing page before launch to catch semantic issues, missing labels, weak focus states, layout shifts, and slow-loading assets.

Quick Start

Ask the frontend skill to review your markup and styles for semantic HTML, WCAG 2.1 AA accessibility, and Core Web Vitals best practices.

Frequently Asked Questions about frontend

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

FAQPage Schema
How do I review my HTML markup for WCAG 2.1 AA accessibility compliance?▼

To review HTML markup for WCAG 2.1 AA accessibility, validate landmarks, headings, labels, and form patterns to ensure pages work correctly for users and assistive technology. This process verifies focus management, contrast, and touch targets.

What is the best way to structure CSS design tokens for maintainable theming?▼

The best way to structure CSS design tokens is by applying custom properties, layering, logical properties, and container queries. A clean token taxonomy ensures maintainable theming and consistent styling architecture across framework-agnostic interfaces.

How do I optimize Core Web Vitals for images and script loading?▼

To optimize Core Web Vitals for images and script loading, review asset delivery, image sizing, and script loading patterns. This frontend optimization prevents layout shifts and improves overall page performance metrics.

Does this frontend guidance apply to vanilla JavaScript and Tailwind configuration?▼

Yes, this frontend guidance applies to vanilla JavaScript and Tailwind configuration. It provides framework-agnostic browser patterns for UI authoring and code review, covering semantic HTML, accessible interactions, and CSS architecture.

Why does my landing page have weak focus states and layout shifts before launch?▼

Your landing page has weak focus states and layout shifts because of missing semantic HTML, inadequate CSS architecture, and unoptimized asset delivery. Reviewing markup, styles, and Core Web Vitals targets resolves these frontend issues.

Related Skills

Explore More Software Engineering Skills→
thec3ukthec3uk

Frontend Accessibility

Guide frontend code to meet accessibility standards like ARIA and keyboard navigation.

Official
Basic
LimaTechnologiesLimaTechnologies

ui-ux-audit

Automate UI/UX audits for accessibility, responsiveness, and design-system consistency.

Community
Basic
saajunaidsaajunaid

css-architecture

Establish CSS tokens, conventions, and architecture for unified UI styling.

Community
Advanced
angelgarciasolorzanoangelgarciasolorzano

shadcn

Generate design system guidelines for Shadcn UI components with WCAG 2.2 AA compliance.

Community
Advanced