Skip to content
@mage-obsidian

Magento Obsidian

MageObsidian storefront — a modern frontend for Magento

MageObsidian

A modern frontend for Magento 2 — Vite, Tailwind CSS 4, Vue islands and Twig, built on the native Layouts, Blocks and Templates you already know.

📚 Documentation · 🚀 Live demo · ⚡ Getting started · 💬 Discussions · 🎮 Discord


Why MageObsidian?

Magento's stock frontend still ships LESS, RequireJS and jQuery from 2012. MageObsidian replaces that layer with a modern toolchain — native ESM, Vite dev server with HMR, Tailwind CSS 4 and Vue 3 islands — without throwing away Magento itself: layouts, blocks, templates, theme inheritance and the module system all keep working exactly as you know them.

No headless rewrite. No parallel stack to maintain. Your PHP developers keep their workflow; your frontend developers finally get theirs.

Lighthouse report: 100 in Performance, Accessibility, Best Practices and SEO

The live demo scores 100/100/100/100 on Lighthouse.

Highlights

  • ⚡ Vite + HMR inside Magento — instant feedback while editing themes and modules.
  • 🎨 Tailwind CSS 4 with per-theme extension and full theme-inheritance support.
  • 🏝️ Vue 3 islands — interactive components mounted lazily over server-rendered pages.
  • 🌿 Optional Twig engine — write .twig templates alongside .phtml.
  • 🧩 JS interceptors — a JS port of Magento's plugin system (before/around/after) so modules can customize each other's JavaScript without patching source.
  • 📦 Luma-parity storefront — compatibility modules for catalog, checkout, customer, wishlist, reviews and more.

Repositories

Repository Role
module-modern-frontend Core Magento 2 module — start here
module-modern-frontend-cli bin/magento CLI commands
component-modern-frontend Vite build harness mapped into the Magento root
js-package-utils The JS build engine (npm: mage-obsidian)
module-modern-frontend-twig Optional Twig template engine
module-storefront Storefront foundation (Vue islands + Twig components)
theme-default OBSIDIAN — the default theme (live demo)
docs Documentation site (EN/ES)
module-* Domain compatibility modules: catalog, checkout, customer, sales, wishlist, reviews…

Quick start

composer require mage-obsidian/component-modern-frontend
pnpm --prefix vite install
bin/magento setup:upgrade
bin/magento mage-obsidian:frontend:config --generate

Full instructions in the installation guide.

Community

Pinned Loading

  1. framework framework Public

    MageObsidian framework — replaces Magento 2's Luma/LESS/RequireJS frontend with Vite, Tailwind CSS 4, Vue and native ESM. Monorepo of the core module, CLI, Twig engine, Vite harness and JS build en…

    PHP

  2. storefront storefront Public

    MageObsidian storefront — Luma-parity Magento 2 storefront built with Vue islands, Twig and Tailwind CSS on native blocks. Monorepo of the domain modules and the base theme.

    PHP 1

  3. theme-default theme-default Public

    OBSIDIAN — the default MageObsidian storefront theme for Magento 2 (Vite + Tailwind CSS 4 + Vue islands).

    Twig 1 1

  4. docs docs Public

    Official MageObsidian documentation — bilingual (EN/ES) MkDocs Material site.

    HTML 1

Repositories

Showing 10 of 29 repositories
  • module-instant-purchase Public

    Read-only mirror of mage-obsidian/storefront. Instant Purchase compatibility for MageObsidian: the PDP one-click buy button rendered as a Vue island over the native instant-purchase customer-data section.

    mage-obsidian/module-instant-purchase's past year of commit activity
    TypeScript 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-search Public

    Read-only mirror of mage-obsidian/storefront. Filtering, sorting and paging a Magento listing without re-assembling the page.

    mage-obsidian/module-search's past year of commit activity
    PHP 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-vault Public

    Read-only mirror of mage-obsidian/storefront. Vault (stored payment methods) compatibility for MageObsidian: the customer account card management rendered with Twig over the native Vault tokens.

    mage-obsidian/module-vault's past year of commit activity
    PHP 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-multishipping Public

    Read-only mirror of mage-obsidian/storefront. Multishipping (ship to multiple addresses) compatibility for MageObsidian: the multi-address checkout flow rendered with Twig over the native Multishipping blocks.

    mage-obsidian/module-multishipping's past year of commit activity
    PHP 0 MIT 1 0 0 Updated Oct 6, 2026
  • theme-base Public

    Read-only mirror of mage-obsidian/storefront. MageObsidian base theme — the unskinned foundation theme for the MageObsidian storefront stack.

    mage-obsidian/theme-base's past year of commit activity
    HTML 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-wishlist Public

    Read-only mirror of mage-obsidian/storefront. Wishlist domain compatibility for MageObsidian: the customer wish-list page (move to cart, remove) on the account shell, server-rendered with native progressive-enhancement forms.

    mage-obsidian/module-wishlist's past year of commit activity
    PHP 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-customer Public

    Read-only mirror of mage-obsidian/storefront. Customer domain compatibility for MageObsidian: account auth (login, register, password reset) and the header account state, built on the storefront foundation with progressive-enhancement Vue islands.

    mage-obsidian/module-customer's past year of commit activity
    TypeScript 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-checkout Public

    Read-only mirror of mage-obsidian/storefront. Checkout domain compatibility for MageObsidian: mini-cart drawer and shopping bag page (Vue islands, layout and ViewModels) built on the storefront foundation.

    mage-obsidian/module-checkout's past year of commit activity
    TypeScript 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-catalog Public

    Read-only mirror of mage-obsidian/storefront. Catalog domain compatibility for MageObsidian: category listing and product detail page (ViewModels, layout and Vue islands) built on the storefront foundation.

    mage-obsidian/module-catalog's past year of commit activity
    PHP 0 MIT 1 0 0 Updated Oct 6, 2026
  • module-review Public

    Read-only mirror of mage-obsidian/storefront. Product reviews domain compatibility for MageObsidian: the PDP rating summary, approved review list and submit form on native Magento_Review blocks, with review/aggregateRating JSON-LD.

    mage-obsidian/module-review's past year of commit activity
    PHP 0 MIT 1 0 0 Updated Oct 6, 2026

People

This organization has no public members. You must be a member to see who’s a part of this organization.

Top languages

Loading…

Most used topics

Loading…