Mast
An editorial Shopify theme for brands that care about how they tell their story. Designed for fashion, lifestyle, and limited-run labels.
What is Mast?
Mast is a premium Shopify theme built for editorial storytelling. Where most ecommerce themes treat content as an afterthought, Mast puts narrative first: large imagery, generous whitespace, and typography with genuine character.
The theme is built around a design token system that gives merchants complete control over color, typography, spacing, and layout without writing a single line of CSS. Every visual decisión is exposed as a setting in the Shopify theme editor and cascades consistently through every section and template.
Mast was designed and developed by 0A and is currently under review for the official Shopify Theme Store. It targets a Lighthouse performance score above 90, full WCAG AA accessibility compliance, and a JavaScript bundle under 15 KB minified.
Who it is for
Mast is purpose-built for merchants where brand presentation matters as much as product. If your customer is buying a feeling as much as an object, Mast is the right foundation.
- —Fashion labels and clothing brands that need editorial-quality presentation
- —Lifestyle, beauty, and home goods brands with strong visual identity
- —Small-run and artisanal brands where craft and story matter as much as product
- —Capsule collections and seasonal drops that live or die by how the launch feels
- —Creative agencies and studios building flagship Shopify stores for high-end clients
- —Any Shopify merchant who wants their store to feel like a magazine, not a catalog
Key features
Design token system
All visual decisions flow from four color roles, three font slots, and a handful of spacing and layout values. Change them once, update everywhere.
Three curated presets
Mast, Press, and Nocturne are complete visual identities, not color swaps. Each ships with its own fonts, colors, and tone.
Editorial sections
Chapter openers, lookbook grids, spread layouts, and a contents table treat your homepage like a well-edited magazine issue.
Performance first
Critical CSS inline, non-blocking stylesheets, ~14 KB JS bundle, font-display: swap, and IntersectionObserver-based lazy loading.
WCAG AA accessible
Skip link, focus management for all drawers and modals, ARIA labels throughout, reduced motion support, and semantic HTML.
Shopify 2.0 native
App blocks, metafield support, Section Rendering API for cart, and Online Store 2.0 JSON templates throughout.
Mega menu
Header supports a full-width mega dropdown with image columns, link groups, and featured products.
Cart drawer
Slide-in cart with line item editing, upsell block support, and shipping threshold progress bar.
Lookbook with hotspots
Tag products directly on editorial images. Clicking a hotspot opens a quick-add panel without leaving the page.
16 page templates
Beyond the standard set, Mast ships specialized templates for lookbooks, stockists, manifesto pages, press kits, FAQs, and more.
Presets
Mast ships with three distinct presets. Each is a fully considered design direction, not merely a color swap. Fonts, proportions, and visual rhythm are all tuned per preset.
Mast
Warm, artisanal, editorial
The default preset. Warm cream paper, deep charcoal ink, and amber gold accents evoke the feeling of an independent fashion magazine or a well-worn craft studio.
Instrument SerifAlmaraiCourier NewPress
Newspaper, editorial, bold
Inspired by newspaper editorial design. Sharp contrast, bold headings in Playfair Display, and red accents make it ideal for brands with a strong point of view.
Playfair DisplayInterIBM Plex MonoNocturne
Dark mode, luxury, nocturnal
A dark-mode first preset for luxury and night-world aesthetics. EB Garamond for headings adds gravitas. The warm amber accent prevents it from feeling cold.
EB GaramondAlmaraiCourier NewGetting started
Mast is available on the Shopify Theme Store once the review process is complete. The workflow below applies once you have access.
- 01
Purchase and install
Find Mast in the Shopify Theme Store, click Add theme, and Shopify will install it to your store automatically. It will appear in your Themes admin under the store's theme library.
- 02
Choose a preset
Open the theme editor and go to Theme settings. Under Presets, select Mast, Press, or Nocturne. Each preset sets all color, font, and spacing defaults at once.
- 03
Set your brand colors and fonts
Navigate to Theme settings > Colors and Typography. Override the Paper, Ink, Accent, and Highlight tokens with your brand values. Set Heading, Body, and Accent fonts from the Shopify font picker.
- 04
Build your homepage
Go to the Home page template. Use the Add section button to place sections. The Image Banner, Chapter, Featured Collection, and Lookbook sections are good starting points for an editorial homepage.
- 05
Configure the header and footer
In the Header section, set your logo (or wordmark text), navigation menu, and toggle the sticky header and folio strip options. In the Footer section, configure link columns and the colophon strip.
- 06
Set up product and collection pages
Review the product template settings: gallery layout, variant picker style, and add-to-cart placement. On the collection template, configure the grid density, filtering sidebar, and sort options.
- 07
Publish
When you are ready, click Publish in the theme editor. Your store will immediately switch to Mast. If you want to preview before going live, use the Preview button to see any template without affecting your live store.
Theme architecture
Understanding the structure of Mast helps when extending or customizing it beyond what the theme editor exposes.
CSS custom properties
All design tokens are written as CSS custom properties on :root. The theme editor writes to these variables, and every section reads from them. Overriding a token in custom CSS is safe and will cascade everywhere.
Section Liquid files
Each section is a self-contained .liquid file in the /sections folder. Sections define their own schema, which powers the theme editor UI. Customizing a section means only editing that file.
Snippet library
Reusable components (product cards, icon sprites, pagination, breadcrumbs) live in /snippets. Sections render snippets vía {% render %}. This keeps section files lean and ensures visual consistency.
JavaScript modules
All JavaScript is written as ES modules loaded vía <script type="module">. There are no global variables and no jQuery dependency. The total JS payload is approximately 14 KB minified.
JSON templates
Every template is a JSON file that declares which sections appear and in what order. This is the Shopify 2.0 model: templates are data, not markup. Merchants can rearrange and add sections without code.
Theme settings schema
config/settings_schema.json defines every setting exposed in Theme settings, organized into groups: Colors, Typography, Layout, Cart, and Social. Changes here are reflected immediately in the editor sidebar.