Project Config

project.config.json is the single configuration file for a Meno project. It lives in the project root, alongside colors.json and variables.json, and holds site-wide settings: the public origin, the on-disk format, locales, responsive breakpoints, registered fonts, and more.

Everything in this file maps to the editor's Project Settings panel — changing a value there writes the same key here. The file is plain JSON and version-controlled, so you can also edit it by hand and review changes in git like any other source file. See Project Structure for where it sits in the tree.

{
  "siteUrl": "https://meno.so",
  "format": "astro",
  "editor": { "theme": "light" },
  "i18n": { "defaultLocale": "en", "locales": [] },
  "breakpoints": { "tablet": {}, "mobile": {} },
  "fonts": [],
  "baseComponent": "Layout"
}

siteUrl

The public origin of the deployed site, including protocol and no trailing slash. Meno uses it as the base for canonical links, hreflang alternates, and the generated sitemap during astro build.

{
  "siteUrl": "https://meno.so"
}

Set this to your production domain before you ship. See Deployment for how the built site is published.

format

The project's on-disk format. For a meno-astro project this is always "astro" — it tells Meno the source of truth is .astro files under src/pages/ and src/components/ (the meno-astro dialect), rather than the legacy JSON model.

{
  "format": "astro"
}

You do not normally change this; it is set when the project is created.

editor

Editor preferences that apply to your view of the project in the Meno editor. The current key is theme, the editor color theme.

{
  "editor": { "theme": "light" }
}

The allowed values for theme come from the enums block (see below).

i18n

Internationalization config: the default locale plus the list of locales the site ships in. Each entry in locales[] describes one language.

{
  "i18n": {
    "defaultLocale": "en",
    "locales": [
      {
        "code": "en",
        "name": "English",
        "nativeName": "English",
        "langTag": "en-US"
      }
    ]
  }
}

The fields on each locale:

The defaultLocale is served at the root (/about); other locales are prefixed (/pl/about). These locale codes are the keys you supply to i18n({ _i18n: true, en: "…", pl: "…" }) in your markup. For the full setup, see Internationalization.

breakpoints

The pixel thresholds your responsive styles use. Meno has two responsive tiers below the desktop base — tablet and mobile — and each is an object with two numbers.

{
  "breakpoints": {
    "tablet": { "breakpoint": 1024, "previewPoint": 900 },
    "mobile": { "breakpoint": 540, "previewPoint": 400 }
  }
}

These thresholds are where the tablet and mobile keys in style({ base, tablet, mobile }) take effect. See Styling for how breakpoint overrides work.

fonts

The list of font files registered for the project. Each entry becomes a @font-face declaration in the built CSS, and the family name is what you reference in style() and in variables.json.

{
  "fonts": [
    {
      "path": "/fonts/Inter-VariableFont_opsz,wght.woff2",
      "family": "Inter",
      "weight": 100,
      "weightMax": 900,
      "fontDisplay": "swap"
    }
  ]
}

A variable font sets both weight and weightMax to span a range (100–900). A subsetted font omits weightMax and sets unicodeRange so the browser only loads the file when those characters appear, as the Instrument Serif and Instrument Sans latin / latin-ext splits do.

responsiveScales

Auto-scaling multipliers that shrink numeric CSS values at smaller breakpoints, so you write fewer explicit tablet and mobile overrides. When enabled is true, font sizes, padding, margin, and gap are scaled by the per-tier factor.

{
  "responsiveScales": {
    "enabled": true,
    "baseReference": 16,
    "fontSize": { "tablet": 0.8, "mobile": 0.47 },
    "padding": { "tablet": 0.75, "mobile": 0.5 },
    "margin": { "tablet": 0.7, "mobile": 0.45 },
    "gap": { "tablet": 0.65, "mobile": 0.5 }
  }
}

A multiplier of 0.75 scales a value to 75% of its base. An explicit tablet or mobile value in a style() call always wins over the auto-scale. See Styling for the interaction with manual overrides.

remConversion

Controls automatic conversion of pixel values to rem units in the built CSS, using responsiveScales.baseReference as the root size.

{
  "remConversion": { "enabled": true }
}

prefetch

Toggles link prefetching for faster client-side navigation between pages.

{
  "prefetch": { "enabled": false }
}

icons

Paths to the site's favicon and Apple touch icon, served from the icons/ directory. Meno emits the matching <link> tags into the page <head> at build time.

{
  "icons": {
    "favicon": "/icons/icon-32.png",
    "appleTouchIcon": "/icons/icon-180.png"
  }
}

customCode

Raw markup injected into the document <head> of every page. Use it for things Meno does not model directly, such as JSON-LD structured data or third-party <script> tags.

{
  "customCode": {
    "head": "<script type=\"application/ld+json\">{ … }</script>"
  }
}

baseComponent

The name of the component that wraps every page as its layout shell — the project's base layout. In this project it is Layout, the component the page tree is composed inside.

{
  "baseComponent": "Layout"
}

enums

Allowed-value lists for settings that the editor presents as a fixed choice. The current entry constrains editor.theme.

{
  "enums": { "theme": ["light"] }
}

Deployment keys

A few keys describe how and where the project is deployed. They are written by Meno's publish flow and rarely edited by hand.

{
  "previewDomain": "meno-web.maciejkociela.workers.dev",
  "deploymentMethod": "github",
  "astroGithubRepo": "meno-web/meno-web-astro"
}

See Deployment for the full publishing workflow.

Edit these values from the editor's Project Settings panel, or open project.config.json directly — both write the same file, and it travels with your project in version control.

• Project Structure — where project.config.json sits in the tree

• Internationalization — wiring up i18n locales

• Styling — how breakpoints and responsiveScales shape responsive styles

• Deployment — publishing with siteUrl and the deployment keys