Native Scope Kit for Adobe Commerce and Magento Open Source (Hyvä theme)

This kit is for designers, freelancers and agencies who design a store on Magento® Open Source or Adobe Commerce with the Hyvä® theme, and who need to price it before they design it. It answers one question, block by block: is what you are drawing native, configurable in the admin, paid, or custom development? Every block on the screens carries a label that points to a row of the matrix, and every row cites the official documentation page it rests on. You show your client designs the platform can deliver, and you price separately whatever needs an extension or development.

The kit is written in French. The scoping guide is in French only, as are the matrix and the screen labels; documentation excerpts stay in their original language. No English version of the guide is included.

A row caught at scoping is priced before the design rather than at handover: the fallback checkout that needs styling, an Adobe Commerce-only feature shown to a Magento Open Source client, a hover zoom promised when the theme does not provide one.

The scope was checked against the official documentation on 11 November 2026, for Magento Open Source and Adobe Commerce 2.4.9 and the Hyvä 1.5.3 default theme. The kit helps you scope and design: it is not an audit of your store and makes no claim to be exhaustive.

• A 103-row matrix, one row per feature, grouped by area: catalogue, navigation and search, product page, cart, checkout, account, content, emails, international, theme and B2B.
  • Status: 47 native rows, 54 configurable rows with the exact admin path, 2 extension rows, none requiring development.
  • Edition: 95 rows apply to both Magento Open Source and Adobe Commerce, 8 are Adobe Commerce only.
  • Hyvä front end: 78 rows covered by the default theme, 12 checkout rows served by the Luma fallback module, 8 as a paid extension (Hyvä Enterprise), 1 in the paid Hyvä UI library, 1 requiring development, 3 not applicable. Another column gives the Luma front end.
  • Quote risk: 77 rows low, 25 medium, 1 high.
  • Sources: every row cites its official page, the date it was read and a short excerpt in its original language, 96 source URLs in all. The spreadsheet adds Screens, Extensions (with recorded prices) and Sources sheets.
• A design file for Figma: 26 desktop screens, their 26 mobile versions and 3 emails (order confirmation, welcome, password reset).
  • Screens: home, category with layered navigation, search results, simple, configurable, grouped and bundle product pages, compare, mini cart, cart, checkout (shipping, then payment and review), confirmation, sign-in, account creation, forgotten password, customer account (dashboard, orders, order detail, address book, information, wish list, reviews), content page, not-found page and contact.
  • Labels: 76 matrix rows are drawn. Every block carries a two-line label, the row ID and status, then the Hyvä front-end value, always spelled out and placed on an annotations layer you can hide.
  • Foundations and components: 55 variables, 16 text styles, 3 effect styles, 25 component sets with 91 variants (buttons, fields, checkboxes and radio buttons, swatches, quantity, badges, prices, product card, facets, active filters, breadcrumb, pagination, tabs, accordion, messages, ratings, checkout steps, cart line, scope label, header and footer in desktop and mobile) and 31 icons. No logos, no Hyvä UI components.
• 58 tokens, including 14 colours, 13 spacing steps, 6 radii, 9 text sizes with their line height, 3 font weights and 3 shadows, identical in the design file, the token files and the theme configuration. No step off the spacing grid.
• The theme configuration: the block to merge into the Hyvä configuration, the CSS file it should produce so you can check your build, a configuration for a theme still on Tailwind CSS 3, and an annotated list of the differences from the default configuration, to apply or reject at handover.
• A 22-page scoping guide, in French: reading the matrix and the labels, the 6 questions to ask the client before designing, a step-by-step scoping workshop, 12 pitfalls where a plausible design leaves native scope without saying so, handover to development, the 8 features the kit does not settle for lack of an official source, and the sources.
• A 21-point handover checklist, in the guide and as a text file to paste into a ticket.

Kit files:

LICENCE.txt
LISEZMOI.txt
CREDITS.txt
figma/native-scope-kit-for-magento-hyva-1.0.0.fig
guide/guide-cadrage.pdf
guide/checklist-passation.md
matrice/perimetre-natif.xlsx
matrice/perimetre-natif.csv
tokens/tokens.json
tokens/tokens.2025-10.json
theme/config-tokens.json
theme/theme.css
theme/tailwind.config.js
theme/ecarts-config-defaut.md

• Matrix in XLSX and UTF-8 CSV, with the same IDs: the spreadsheet has drop-down lists and filters by client (edition, Hyvä front end), by screen or by risk; the CSV imports into any spreadsheet or tracking tool.
• Guide as a tagged A4 PDF, with bookmarks, in French, and the checklist in Markdown.
• Tokens in DTCG JSON in the format read by the theme’s hyva-tokens tool (tokens/tokens.json), and the same tokens in DTCG 2025.10 format for other tools (tokens/tokens.2025-10.json).
• Theme: theme/theme.css is the expected Tailwind CSS 4 output (@theme); theme/tailwind.config.js carries the same scale for Tailwind CSS 3. The configuration was checked with the hyva-tokens tool in a test project outside a store, not in a full store.
• .fig file: a Figma-compatible file, to import into your workspace.
• Fonts: Inter (SIL OFL 1.1) is referenced by the tokens and not supplied: your project loads it. The guide is set in Work Sans (SIL OFL 1.1), embedded in the PDF.
• Versions checked: Magento Open Source and Adobe Commerce 2.4.9, Hyvä 1.5.3 default theme.

Good to know before you buy:

• The kit contains no Magento extension or module: it is for scoping, designing and handing over to development.
• Hyvä UI, the theme vendor’s paid component library, is not included, and the kit draws none of its components. Neither is Hyvä Checkout: the checkout drawn is the Luma fallback, and the paid alternative is flagged by a label.
• No B2B screens: one matrix row flags the topic so it is raised before design starts.
• The guide, the matrix and the labels are in French; there is no English guide.
• Extension prices quoted in the matrix were recorded on 11 November 2026: check them before any quote.
• Updates: free for buyers, released as the platform evolves, with no guaranteed schedule. They cover fixes to the kit and, when a new platform or theme release changes a status, a source or the configuration, updates to the matrix, labels, tokens and guide.

The kit is sold under the commercial license (terms in French), as a one-off payment: you may use it in your personal and professional projects, including for clients, but you may not resell or redistribute its files, even modified, as a kit or as a template.

• Design Tokens: What the New W3C DTCG Standard Really Changes

1.0.0 (11 November 2026): first version.

Independent kit, not affiliated with, endorsed or sponsored by Adobe Inc. or Hyvä Themes B.V. Adobe and Adobe Commerce are either registered trademarks or trademarks of Adobe in the United States and/or other countries. Magento® is a registered trademark of Adobe. Hyvä® is a registered trademark of Hyvä Themes B.V. Platform and theme names are used here only to state compatibility; the screens are redrawn from the documented page structure, with no logos and no screenshots of a real store.

AI disclosure: the matrix, guide text, tokens, configuration, check scripts and the build of the design file were produced with an AI assistant (Claude Code, Anthropic), then checked by scripts and two separate reviews. Every matrix row was checked against its official source on 11 November 2026. The kit contains no AI-generated images.