Frontend Design HTML Skill

Create distinctive, production-grade HTML/CSS + vanilla JavaScript interfaces with high design quality. This skill combines the 5-dimension aesthetic framework with semantic HTML5, modern CSS, and CSS-only animations to build interfaces that are both beautiful and accessible.

Base Aesthetics Framework

Overview

This is the core 5-dimension framework for creating intentional, non-generic design that avoids the homogenized aesthetic of default AI outputs. Each dimension works together to create designs with personality and deliberation.

The Five Dimensions

1. Typography Dimension

Purpose: Typography is the primary carrier of voice and personality in digital design.