MeDo

Turn a website’s visual language into a reusable design contract.

Study publicly observable colors, typography, spacing, shapes, and motion. Keep the visual system as a design.md your AI coding agent can follow — without copying the original site’s content or component structure.

Scope / visual system only

Color and type tokens
Spacing, shape, and motion rules
Reusable design.md output

Opens MeDo with a prepared visual-analysis brief. Review the generated file before using it.

Public studies / 02

Browse website design systems

Each study turns observable visual patterns into explicit tokens and rules. Use it as a starting point, then adapt it to your own product and brand.

PRODUCT SYSTEM01 — 05

One visual decision at a time.

Quiet surfaces.
Clear focus.

Apple-inspired website style

A restrained product-marketing system built from monochrome surfaces, precise type scale, generous whitespace, and focused blue actions.

Open study
DESIGN / DOCUMENTPublic study

Working style 02

Make the system readable.

Notion-inspired website style

A warm editorial system combining document-like rhythm, friendly illustration space, crisp borders, and a compact palette of tinted accents.

Open study

The extraction boundary

A design contract, not a website copy.

Included

  • Colors and semantic usage
  • Typography roles and scale
  • Spacing, grids, and shapes
  • Motion and composition rules

Not included

  • Original text or media
  • Copied page structure
  • Cloned components or behavior
  • Brand endorsement or affiliation