Liquid is a native platform alongside Astro and React. It shares the semantic tokens, component names, variants and data-slot parts. Components use handwritten CSS and native HTML; small ES modules add behavior and handle Shopify editor lifecycle.
Browse the components, open any live preview and copy its Liquid from the Usage tab. The preview renders that exact source with the installed library styles and runtime. No Tailwind or build runs in your theme.
Install the library once in your theme. Your sections, content, translations, settings and Shopify commerce adapters stay in the theme. Individual install commands appear on every component page. Universal items use explicit ~/snippets/ and ~/assets/ targets.
Styling
The native port follows Vega. Theme tokens follow the docs’ color and font selection; changing a Tailwind style such as Nova does not regenerate Liquid CSS. Theming describes the override order.
Scope
The component catalog lists the supported native items. Shopify commerce blocks, Sidebar, Resizable, Menubar, Scroll Area and React-only app primitives are outside this set. Switching an unsupported component to Liquid opens the native catalog.
The previews use LiquidJS for native markup. Shopify commerce rendering and stylesheet subsetting still require an approved store/theme test.