# Overview

FoxStudio is Foxify's visual editor, where you design and customize every page of your Shopify store. Drag and drop elements, style them visually, or ask Foxie AI to make changes for you, with no code needed.

<Figure>
  <a href="https://youtu.be/fx1-cCf8lw0?si=qEFb4Jw0YSshgf-Y" target="_blank" rel="noopener noreferrer">
    <img src="https://foxecom.com/cdn/shop/articles/Introduce_Foxify_Gen_2_1200_x_628.png?v=1726067243&width=3000" alt="Introducing Foxify Gen 2 - The First-Ever Shopify Visual Page Builder" />
  </a>

  <Figcaption>
    Watch introduction video
  </Figcaption>
</Figure>

## New to FoxStudio? Start here

<PageLink href="https://docs.foxecom.com/foxify-app/foxstudio/get-to-know-the-editor" subtitle="A quick tour of the top bar, sidebar, canvas, and Inspector">
  Get to know the editor
</PageLink>

## What you can do in FoxStudio

* **Build visually:** drag and drop [sections](https://docs.foxecom.com/foxify-app/foxstudio/page-customization/add-a-section) and [elements](https://docs.foxecom.com/foxify-app/foxstudio/add-and-edit-elements), then see your changes instantly on the canvas.
* **Edit with AI:** ask [Foxie AI](https://docs.foxecom.com/foxify-app/foxify-ai/foxie-ai-agent-build-and-edit-pages-by-chatting) to build or change your page by chatting.
* **Design for every device:** adjust your layout for desktop, tablet, and mobile, or use [AI Responsive](https://docs.foxecom.com/foxify-app/foxstudio/editor-tools/ai-responsive) to do it automatically.
* **Keep your brand consistent:** set colors, fonts, and buttons once with [Global styles](https://docs.foxecom.com/foxify-app/foxstudio/page-customization/global-styles).
* **Add store features:** connect [Foxify extensions](https://docs.foxecom.com/foxify-app/integrations/foxify-extensions) and third-party apps, like reviews, filters, and sticky add to cart.
* **Import existing designs:** bring in a design from a website or Figma.&#x20;

## Explore FoxStudio

<Cards columns="2">
  <Card title="Editor tools" description="Page layers, the Inspector panel, revisions, custom code, and other tools that speed up your work." image="https://docs-assets.foxecom.app/foxify-app/Editor%20tools_J8PWRJrY.jpg" href="https://docs.foxecom.com/foxify-app/foxstudio/editor-tools" />

  <Card title="Page customization" description="Page settings, sections, global styles, and saved assets." image="https://docs-assets.foxecom.app/foxify-app/Page%20customization_Y07z1lsL.jpg" href="https://docs.foxecom.com/foxify-app/foxstudio/page-customization" />

  <Card title="Add and edit elements" description="Text, images, buttons, product details, and every other element you can add to your page." image="https://docs-assets.foxecom.app/foxify-app/Add%20and%20edit%20elements_94IrcTKY.jpg" href="https://docs.foxecom.com/foxify-app/foxstudio/add-and-edit-elements" />

  <Card title="Layout & styling" description="Stacks, grids, sizing, spacing, and animations for full control over how your page looks." image="https://docs-assets.foxecom.app/foxify-app/Element%20layout%20%26%20styling_NnmNgHOF.jpg" href="https://docs.foxecom.com/foxify-app/foxstudio/layout-and-styling" />
</Cards>