frontend-math-foundations

Original：🇺🇸 English

Translated

Explain and apply foundational math for front-end development, including arithmetic, algebra, ratios, exponents, roots, linear equations, inequalities, geometry, trigonometry, coordinates, and choosing CSS versus JavaScript math. Use when a web design calculation needs first-principles explanation before applying CSS, JavaScript, Grid, Flexbox, responsive, or color-specific skills.

17installs

Sourcelvtd-llc/skills

Added on2026-09-06

NPX Install

npx skill4agent add lvtd-llc/skills frontend-math-foundations

SKILL.md Content

View Translation Comparison →

Frontend Math Foundations

Use this skill as the foundation layer for front-end math. It helps translate a visual or interaction problem into arithmetic, algebra, ratios, geometry, trigonometry, coordinates, or a CSS-vs-JavaScript ownership decision.

Quick Start

Read
```
guidelines.md
```
to select the smallest relevant file set.
Load
```
references/math-foundations/rules.md
```
for implementation decisions.
Load
```
references/math-foundations/examples.md
```
when editing code.
Use
```
workflows/choose-math-approach.md
```
for multi-step derivation or debugging.

Resource	Purpose
`guidelines.md`	Routes tasks to the right reference files
`references/source-map.md`	Book source and chapter/section traceability
`references/math-foundations/knowledge.md`	Core concepts and terminology
`references/math-foundations/rules.md`	Practical rules, guidelines, and exceptions
`references/math-foundations/examples.md`	Bad/good examples and refactoring approach
`references/math-foundations/patterns.md`	Reusable formula and implementation patterns
`references/math-foundations/checklist.md`	Review checklist and red flags
`workflows/choose-math-approach.md`	Step-by-step workflow

Source

Derived from Math for Web Design by Paul McFedries, Chapter 1: Web dev math fundamentals. Citations are tracked in

references/source-map.md

.