# Meno

> Meno is a local-first visual website builder for Astro. Design real Astro sites on a visual canvas - or by hand in `.astro` files - with native AI and Git built in, and own all the output: standard static HTML you can self-host anywhere, with no vendor lock-in.

A Meno project is a normal Astro codebase: `.astro` pages and components under `src/`, JSON content collections, and plain config files. Edits made in the visual editor and hand-edits to the files stay in sync through the meno-astro dialect, so the visual tool and the code are never out of step. The Meno Studio desktop app (Mac, Windows, Linux) is free for personal use, with a seat-based Team plan for collaboration and advanced editing. Meno Studio itself is proprietary, but the `meno-astro` library that powers the sites - the Astro runtime and round-trippable dialect - is open-source on npm, and the output is standard Astro you fully own.

Full documentation lives at https://meno.so/docs.

## Getting Started
- [Installation](https://meno.so/docs/installation): Download and install the Meno desktop app for Mac or Windows, sign in with GitHub, and open your first project.
- [Quickstart](https://meno.so/docs/quickstart): Build your first Meno page in fifteen minutes - create a project, tour the editor, add and style content, then preview and publish.
- [Project Structure](https://meno.so/docs/project-structure): A Meno project is a normal Astro project. Tour the src/pages, src/components, and src/content folders and the config files.

## Editor
- [Editor Overview](https://meno.so/docs/editor-overview): A tour of the Meno Studio editing surface - the canvas, structure tree, components, properties and style panels, and the AI assistant.
- [Structure Tree](https://meno.so/docs/structure-tree): The structure tree shows your page's node hierarchy. Select, reorder, nest, and rename the elements and components that make up a page.
- [The Style Panel](https://meno.so/docs/styling-editor): Use the visual Style panel to set layout, spacing, type, color, and states. Everything you set is written into the element's style() call.
- [Properties Panel](https://meno.so/docs/properties-panel): The properties panel edits the selected node - a component's props, an element's attributes and content, data bindings, and visibility.
- [AI Assistant](https://meno.so/docs/ai-assistant): Meno Studio's built-in AI assistant can read your project and make edits - pages, components, styles, and content - right in the editor.
- [Publishing](https://meno.so/docs/publishing): Preview and publish your project from Meno - how drafts become live content, and how to publish to Meno hosting or deploy the site yourself.
- [Keyboard Shortcuts](https://meno.so/docs/keyboard-shortcuts): A reference of Meno Studio keyboard shortcuts for editing, navigation, and view, with Mac and Windows keys.

## Guides
- [Creating Pages](https://meno.so/docs/creating-pages): Pages are .astro files under src/pages - the filename is the route. Learn the anatomy of a Meno page and how to add content.
- [Building Components](https://meno.so/docs/building-components): Components are single .astro files. Learn the resolveProps prop block, __meno metadata, slots, and inline styles and scripts.
- [Styling](https://meno.so/docs/styling): Styles live in style() as a responsive StyleObject. Learn breakpoints, color and token variables, and prop-bound style mappings.
- [Interactive Styles](https://meno.so/docs/interactive-styles): Hover, focus, and JS-triggered states are CSS declared in the style() meta argument. Learn prefix/postfix selectors and child targeting.
- [JavaScript](https://meno.so/docs/javascript): Component behavior lives in a script with el and props in scope. Learn the data-el pattern, state classes, and cross-component CustomEvents.
- [Lists](https://meno.so/docs/lists): Repeat markup over a prop array with list().map or over a CMS collection with getCollectionList. Learn loop variables, queries, and nesting.
- [Content Management System](https://meno.so/docs/cms): CMS content lives as JSON items in src/content, with schemas defined by each collection's template page. Learn collections, schemas, and rendering.
- [Internationalization (i18n)](https://meno.so/docs/internationalization): Configure locales in project.config.json, author i18n values wrapped in i18n(), and get localized routes, slugs, and a locale switcher.
- [Client-Side Filtering and Search](https://meno.so/docs/filtering-and-search): Filter and search collection lists at build time with queryList, or live in the browser with MenoFilter. Learn when to use each.
- [Hand-Editing & Round-Trip](https://meno.so/docs/hand-editing): Edit .astro files by hand and stay in sync with the visual editor. The dialect grammar, the golden rules, and what round-trips.
- [AI & Claude Code](https://meno.so/docs/claude-code): A Meno project is a normal repo of .astro files, so any AI coding agent can edit it. Meno ships a CLAUDE.md and a meno-astro skill to guide it.
- [Deployment](https://meno.so/docs/deployment): A Meno project builds with astro build into dist and deploys to any static host. Learn build settings, _headers/_redirects, and Git-based deploys.

## Reference
- [Node Types](https://meno.so/docs/node-types): Every Meno node renders as meno-astro markup. A reference for elements, components, slots, links, embeds, lists, and locale switchers.
- [Component Props](https://meno.so/docs/component-props): Props are declared in the resolveProps argument. A reference for the prop types - string, number, boolean, select, link, file, rich-text - and defaults.
- [Style Properties](https://meno.so/docs/style-properties): A catalog of the CSS properties you can set in style() - camelCase names, color and token variables, breakpoints, and prop-bound mappings.
- [CMS Fields](https://meno.so/docs/cms-fields): A reference for CMS field types - string, text, rich-text, number, boolean, image, date, select, reference, and i18n - and their options.
- [MenoFilter API](https://meno.so/docs/meno-filter-api): The client-side filtering and search runtime plus the build-time query helpers - data-attribute wiring, operators, sort, and queryList.
- [Project Config](https://meno.so/docs/project-config): A reference for project.config.json - siteUrl, format, locales, breakpoints, and fonts. The single file behind Project Settings.
- [Template Expressions](https://meno.so/docs/template-expressions): How {{expr}} templates map to JSX expressions in markup - whole-string vs mixed, conditionals, dynamic tags, and CMS i18n wrapping.
- [meno-astro Runtime API](https://meno.so/docs/meno-astro-api): The helpers and components emitted .astro imports from the meno-astro package - style, i18n, lists, links, rich text, and the page layout.

## Tutorials
- [Build a Blog with Meno](https://meno.so/docs/build-a-blog): A step-by-step tutorial - define a posts collection, build the post template and blog index, add content, and publish.
- [Build a Product Catalog with Meno](https://meno.so/docs/build-a-product-catalog): A step-by-step tutorial - define a products collection, build the product template and catalog grid, then add filtering and search.

## App
- [Dashboard](https://meno.so/docs/dashboard): The Meno dashboard is where you create, open, and organize projects across your personal and organization accounts.
- [GitHub Integration](https://meno.so/docs/github): A Meno project is a normal Git repo of .astro files and JSON content. Connect it to GitHub for version control, collaboration, and deploys.
- [Organizations](https://meno.so/docs/organizations): Organizations group an org's projects and teammates, mapped to your GitHub org. Team access comes from seat-based Team plans.
- [Licensing](https://meno.so/docs/licensing): Meno has Free and Pro tiers. Get Pro individually, or as an organization through seat-based Team plans billed via Polar - recognized automatically by your GitHub email.

## Product
- [Features](https://meno.so/features): The visual editor, AI assistant, file-based CMS, and Git version control in one desktop app.
- [Pricing](https://meno.so/pricing): Free for personal use; a seat-based Team plan for teams (collaboration and advanced features); custom Enterprise.
- [AI](https://meno.so/ai): How Meno is AI-first: your site is real files in a Git repo, so AI agents - built-in or external (Claude Code, Cursor) - can read and edit it directly.
- [Download](https://meno.so/download): Download the Meno desktop app for macOS, Windows, and Linux.
- [Open Source](https://meno.so/open-source): Meno builds standard Astro sites on the open-source `meno-astro` library (Astro itself is open-source too), so you own, audit, and host your code forever. The Meno Studio editor app is proprietary - free for personal use, paid for teams.
- [Components](https://meno.so/components): The built-in component library you can drop into pages.
- [Chrome Extension](https://meno.so/chrome-extension): Capture any page or element from any website into your Meno project as editable components.
- [Figma Plugin](https://meno.so/figma-plugin): Convert Figma frames, components, and design systems into editable Meno components.
- [Security](https://meno.so/security): Meno's local-first architecture and security practices - your projects stay on your machine.
- [Enterprise](https://meno.so/enterprise): Self-hostable, you-own-the-code alternative to Webflow Enterprise, with GitHub OAuth SSO.

## Use Cases
- [For Developers](https://meno.so/for-developers): Git-native, file-based, AI-first builder with static HTML output and the open-source `meno-astro` runtime.
- [For Agencies](https://meno.so/for-agencies): Hand off a Git repo, not a login; branching for client revisions; multi-project licensing.
- [Self-Hosting](https://meno.so/for-self-hosting): Static HTML output you can deploy to any host - Cloudflare, Netlify, Vercel, AWS, your own server, or air-gapped.
- [No Lock-Ins](https://meno.so/no-lock-ins): Your site is files in your Git repo, with one-click exports - leave anytime and take everything.
- [GitHub + Azure](https://meno.so/azure-enterprise-integration): Enterprise integration: GitHub OAuth, branch-based environments, and GitHub Actions deploys to Azure.

## Comparisons
- [Meno vs Webflow](https://meno.so/meno-vs-webflow): Built on open-source Astro and Git-native vs cloud-only SaaS; static HTML you own vs a proprietary runtime.
- [Meno vs Framer](https://meno.so/meno-vs-framer): File-based, static HTML output, built on open-source Astro vs Framer's hosted client-side runtime.
- [Meno vs Sanity](https://meno.so/meno-vs-sanity): An all-in-one visual builder that ships a complete Astro site vs a headless content backend (and you can use both).
- [Meno vs WordPress](https://meno.so/vs-wordpress): JSON/Astro files and static HTML vs PHP+MySQL server-rendered pages.
- [Meno vs Wix](https://meno.so/vs-wix): Drag-and-drop ease but with clean static HTML, code ownership, and no platform lock-in.
- [Meno vs Squarespace](https://meno.so/vs-squarespace): Self-hostable and built on open-source Astro vs templated, hosting-locked.
- [Meno vs Cursor](https://meno.so/vs-cursor): The visual AI editor for whole websites vs the AI editor for code - same file-based DNA.
- [Meno vs Lovable](https://meno.so/vs-lovable): Static sites you own in your own Git repo vs an AI app on their platform.
- [Meno vs v0](https://meno.so/vs-v0): Generates whole websites - pages, components, CMS - that you keep editing visually, vs single React components.

## Resources
- [Blog](https://meno.so/blog): Articles and updates from the Meno team.
- [Security Whitepaper](https://meno.so/whitepapers): Technical security whitepaper: architecture, data flows, and compliance.
- [Contact Sales](https://meno.so/contact-sales): Talk to the team about Meno for your organization.

## Optional
- [Privacy Policy](https://meno.so/privacy-policy): How Meno handles your data under its local-first architecture.
- [Terms of Service](https://meno.so/terms-of-service): Terms governing use of Meno.