--- title: Tools for building Shopify themes description: Accelerate your theme development process with Shopify’s suite of development tools. source_url: html: https://shopify.dev/docs/storefronts/themes/tools md: https://shopify.dev/docs/storefronts/themes/tools.md --- ExpandOn this page * [Tools for building and editing themes](https://shopify.dev/docs/storefronts/themes/tools#tools-for-building-and-editing-themes) * [Web-based editors for themes](https://shopify.dev/docs/storefronts/themes/tools#web-based-editors-for-themes) * [Access tools](https://shopify.dev/docs/storefronts/themes/tools#access-tools) * [Version control tools](https://shopify.dev/docs/storefronts/themes/tools#version-control-tools) * [Testing tools](https://shopify.dev/docs/storefronts/themes/tools#testing-tools) * [Tools for learning Liquid](https://shopify.dev/docs/storefronts/themes/tools#tools-for-learning-liquid) # Tools for building Shopify themes Shopify provides a range of tools to help you build Shopify themes faster. *** ## Tools for building and editing themes The following tools help you quickly scaffold, test, share, and develop Shopify themes. [![](https://shopify.dev/images/icons/48/clicode.png)![](https://shopify.dev/images/icons/48/clicode-dark.png)](https://shopify.dev/docs/api/shopify-cli/theme) [Shopify CLI 3.x](https://shopify.dev/docs/api/shopify-cli/theme) [A powerful command-line tool for building Shopify themes, and exploring Liquid code in a REPL interface.](https://shopify.dev/docs/api/shopify-cli/theme) [![](https://shopify.dev/images/icons/48/themes.png)![](https://shopify.dev/images/icons/48/themes-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/shopify-liquid-vscode) [Shopify Liquid VS Code extension](https://shopify.dev/docs/storefronts/themes/tools/shopify-liquid-vscode) [Use the Shopify Liquid Visual Studio Code extension to improve your local development experience.](https://shopify.dev/docs/storefronts/themes/tools/shopify-liquid-vscode) ### Legacy tools [![](https://shopify.dev/images/icons/48/clicode.png)![](https://shopify.dev/images/icons/48/clicode-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/cli/cli-2/commands) [Shopify CLI 2.x](https://shopify.dev/docs/storefronts/themes/tools/cli/cli-2/commands) [The previous major version of Shopify CLI.](https://shopify.dev/docs/storefronts/themes/tools/cli/cli-2/commands) [![](https://shopify.dev/images/icons/48/clicode.png)![](https://shopify.dev/images/icons/48/clicode-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/theme-kit) [Theme Kit](https://shopify.dev/docs/storefronts/themes/tools/theme-kit) [A legacy command-line tool for building Shopify themes.](https://shopify.dev/docs/storefronts/themes/tools/theme-kit) *** ## Web-based editors for themes The following tools can be used by merchants and developers to customize themes in the Shopify admin. As a developer, you should account for these tools when you're developing your theme to ensure the best merchant experience. [![](https://shopify.dev/images/icons/48/themes.png)![](https://shopify.dev/images/icons/48/themes-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/online-editor) [Admin theme editor](https://shopify.dev/docs/storefronts/themes/tools/online-editor) [An interactive editor that lets merchants customize their online store and theme.](https://shopify.dev/docs/storefronts/themes/tools/online-editor) [![](https://shopify.dev/images/icons/48/clicode.png)![](https://shopify.dev/images/icons/48/clicode-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/code-editor) [Admin code editor](https://shopify.dev/docs/storefronts/themes/tools/code-editor) [A code editor built into the Shopify admin.](https://shopify.dev/docs/storefronts/themes/tools/code-editor) *** ## Access tools The following tools allow you to access Shopify infrastructure for testing, and help you to safely access merchant stores. [![](https://shopify.dev/images/icons/48/build.png)![](https://shopify.dev/images/icons/48/build-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/development-stores) [Development stores](https://shopify.dev/docs/storefronts/themes/tools/development-stores) [A free Shopify account that you can use to build and test themes.](https://shopify.dev/docs/storefronts/themes/tools/development-stores) [![](https://shopify.dev/images/icons/48/key.png)![](https://shopify.dev/images/icons/48/key-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/collaborator-accounts) [Collaborator accounts](https://shopify.dev/docs/storefronts/themes/tools/collaborator-accounts) [An account that lets you access and manage a merchant's store through the Partner Dashboard.](https://shopify.dev/docs/storefronts/themes/tools/collaborator-accounts) [![](https://shopify.dev/images/icons/48/key.png)![](https://shopify.dev/images/icons/48/key-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/theme-access) [Theme Access app](https://shopify.dev/docs/storefronts/themes/tools/theme-access) [An app that grants programmatic access to themes in a particular store. Used with Shopify CLI and Theme Kit.](https://shopify.dev/docs/storefronts/themes/tools/theme-access) *** ## Version control tools The Shopify GitHub integration helps you to track and push changes to and from a theme in a Shopify store by using Git. [![](https://shopify.dev/images/icons/48/github.png)![](https://shopify.dev/images/icons/48/github-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/github) [Shopify GitHub integration](https://shopify.dev/docs/storefronts/themes/tools/github) [Manage your Shopify theme code by using Git version control.](https://shopify.dev/docs/storefronts/themes/tools/github) *** ## Testing tools The following tools help you to optimize and detect errors in your theme code. [![](https://shopify.dev/images/icons/48/build.png)![](https://shopify.dev/images/icons/48/build-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/theme-check/configuration) [Theme Check](https://shopify.dev/docs/storefronts/themes/tools/theme-check/configuration) [A command-line based linter for themes. Also offered as part of the Shopify Liquid Visual Studio Code extension.](https://shopify.dev/docs/storefronts/themes/tools/theme-check/configuration) [![](https://shopify.dev/images/icons/48/themes.png)![](https://shopify.dev/images/icons/48/themes-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/liquid-prettier-plugin) [Liquid Prettier Plugin](https://shopify.dev/docs/storefronts/themes/tools/liquid-prettier-plugin) [Use the Liquid Prettier Plugin to format your Liquid and HTML in a consistent style.](https://shopify.dev/docs/storefronts/themes/tools/liquid-prettier-plugin) [![](https://shopify.dev/images/icons/48/build.png)![](https://shopify.dev/images/icons/48/build-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/theme-inspector) [Shopify Theme Inspector for Chrome](https://shopify.dev/docs/storefronts/themes/tools/theme-inspector) [Profile and debug your Liquid template performance with this extension for Chrome Developer Tools.](https://shopify.dev/docs/storefronts/themes/tools/theme-inspector) [![](https://shopify.dev/images/icons/48/gear.png)![](https://shopify.dev/images/icons/48/gear-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/lighthouse-ci) [Lighthouse CI](https://shopify.dev/docs/storefronts/themes/tools/lighthouse-ci) [Ensure that your theme is performant by using the Lighthouse CI GitHub Action.](https://shopify.dev/docs/storefronts/themes/tools/lighthouse-ci) [![](https://shopify.dev/images/icons/48/cheatsheet.png)![](https://shopify.dev/images/icons/48/cheatsheet-dark.png)](https://shopify.dev/docs/storefronts/themes/tools/liquid-doc) [LiquidDoc](https://shopify.dev/docs/storefronts/themes/tools/liquid-doc) [Enable enhanced tooling features for Liquid snippets.](https://shopify.dev/docs/storefronts/themes/tools/liquid-doc) *** ## Tools for learning Liquid The following tools help you to learn and write Liquid. [![](https://shopify.dev/images/icons/48/themes.png)![](https://shopify.dev/images/icons/48/themes-dark.png)](https://cdn.shopify.com/) [Imagery](https://cdn.shopify.com/) [Learn how to write image tags, and understand how images are dynamically transformed with Imagery.](https://cdn.shopify.com/) *** * [Tools for building and editing themes](https://shopify.dev/docs/storefronts/themes/tools#tools-for-building-and-editing-themes) * [Web-based editors for themes](https://shopify.dev/docs/storefronts/themes/tools#web-based-editors-for-themes) * [Access tools](https://shopify.dev/docs/storefronts/themes/tools#access-tools) * [Version control tools](https://shopify.dev/docs/storefronts/themes/tools#version-control-tools) * [Testing tools](https://shopify.dev/docs/storefronts/themes/tools#testing-tools) * [Tools for learning Liquid](https://shopify.dev/docs/storefronts/themes/tools#tools-for-learning-liquid)