Why Foundation
Foundation solves a specific problem: several independent projects were repeating the same low-level mechanics with slightly different names, styles and decisions.
What problem it solves
- Repeated breakpoints and SCSS scales.
- Small helpers like
cxduplicated across repositories. - Protected media handled inconsistently.
- Metadata, canonical URLs, sitemaps and static HTML solved multiple times.
- Focus, Escape and scroll lock primitives copied between modals, drawers and overlays.
Why it exists
It was extracted after those patterns were validated in real projects. It did not start as an aspirational library; it became useful once the repetition was clear.
SCSS baseSpacing, radius, z-index, motion, breakpoints and mixins.
TypeScript
cx, guards, DOM targets and keyboard helpers.AccessibilityFocus, Escape, scroll lock, protected media and selectors.
SEO & BuildCanonical URLs, sitemaps, HTML metadata and escaping.
What it is not
Foundation is not a framework, not a visual Design System and not a component library. It does not know project domains, routes, specific metadata, logos, final colors or business rules.