Mise en place for the internet.
A Chrome extension that strips recipe pages down to what matters.
Ingredients. Steps. Nothing else.
You just want to make cookies. Instead you get a popup asking for your email, a 2,000-word story about someone's grandmother, three ads for Dutch ovens, and a "Jump to Recipe" button that barely works.
Mise fixes that. One click and you get the recipe. That's it.
git clone https://github.com/isaacaudet/mise.git
cd mise- Open
chrome://extensions - Enable Developer mode
- Click Load unpacked and select the
extension/folder
Mise reads the Schema.org/Recipe JSON-LD that recipe sites already embed in their pages — the same structured data Google uses to show recipe cards in search results.
No scraping. No AI. No guessing. Just parsing the machine-readable data that's already there, hidden under the ads and life stories.
Recipe page loads → Mise reads JSON-LD → Clean recipe in the popup
Works on any site that uses structured recipe data: NYT Cooking, AllRecipes, Serious Eats, Food Network, Bon Appetit, Budget Bytes, and thousands more.
Click the Mise icon on any recipe page. You get:
- Recipe name and photo
- Prep time, cook time, servings, yield
- Clean ingredient list
- Numbered step-by-step instructions
No ads. No popups. No life stories.
Save recipes to a local cookbook that lives in your browser. No account needed. Rename your cookbook, browse saved recipes, jump back to the original page anytime.
Customize how recipes display:
| Setting | Options |
|---|---|
| Font size | Small · Medium · Large |
| Density | Compact · Comfortable · Spacious |
| Theme | Light · Dark |
Open any recipe in a clean, full-page reader view — no distractions, just the recipe at a comfortable reading size.
mise/
├── extension/ Chrome extension (Manifest V3)
│ ├── manifest.json Extension config
│ ├── content.js Extracts JSON-LD from page DOM
│ ├── popup.* Main UI (HTML/CSS/JS)
│ ├── sidepanel.* Side panel view
│ ├── viewer.* Full-page reader
│ ├── settings.js Preference management
│ └── background.js Service worker
├── shared/ Shared code
│ ├── recipe-parser.js Schema.org/Recipe parser (zero dependencies)
│ └── types.ts TypeScript type definitions
├── web/ Cloudflare Workers backend
│ ├── worker/ API worker (TypeScript)
│ └── wrangler.toml Cloudflare config
└── site/ Landing page
├── index.html Marketing site
└── style.css Dark editorial design
The recipe parser is shared between the extension and the web worker — same extraction logic everywhere, zero dependencies.
Mise uses an editorial aesthetic inspired by food magazines and cookbooks:
- Fraunces — Variable serif for headings and the wordmark
- Plus Jakarta Sans — Geometric sans for body text
- JetBrains Mono — For labels and metadata
- Dark luxury palette: noir, paprika, ivory, linen, parchment
Extension:
Load extension/ as an unpacked Chrome extension. Edit files and reload.
Landing page:
Open site/index.html in a browser. Static HTML/CSS, no build step.
Web worker:
cd web
npm install
npx wrangler devMise en place (French: "everything in its place") is the culinary practice of preparing and organizing all ingredients before cooking. Mise does the same thing for recipe pages — strips away the chaos and puts everything in its place.