Foundations

Version: 0.1.0
Database part: No

The contract

Takes an app's package file, type setup and stylesheets. Returns what to change to keep to the pinned tools, the strict type checks and readable colours.

Settings

Name	What it does
brandColours	The app's own colours, set after the shared tokens, for light and for dark. Defaults to a plain grey look.
typefaces	The app's own fonts. Defaults to the fonts already on the device.
radius	The corner size every other corner follows from. Defaults to 0.5rem.
requiredPackages	The packages the version check insists the app declares. Defaults to react, react-dom, typescript, vitest and zod.

Requires

This block works on its own.

Live demo

The app's brand colour

Teal

Navy

Lime

How the app sets it

Set it for dark mode too

A button in light mode

Light mode. Contrast 5.99 to 1.

A button in dark mode

Dark mode. Contrast 8.17 to 1.

What the block says about the colour

Nothing to fix. The text on the brand colour is readable in both themes.

The app's package file

Every tool at the pinned version

Versions written as ranges

An older Zod and no test runner

{
  "dependencies": {
    "react": "19.3.1",
    "react-dom": "19.3.1",
    "zod": "4.6.7"
  },
  "devDependencies": {
    "typescript": "5.9.3",
    "vitest": "5.1.0"
  }
}

What the block says about the versions

Nothing to fix. Every tool is at the pinned version.

The block pins 16 tools. This runs the same check your app's own test would run.