--- title: "Design components" slug: "design-components" abstract: "Use Design in SitecoreAI to define objectives, coordinate work, and deliver campaigns on time and on brand." --- # Design components In SitecoreAI, **Design** is a single, intuitive workspace where designers, developers, and content authors create, explore, and manage the building blocks of digital experiences. This interface brings together the Design studio, components, forms, and brand kits in one place to ensure consistent design and functionality across sites. With **Design**, teams can readily create, configure, and publish components for use in the Page builder. They can add visualization values, generate variants, and reuse on-brand components, forms, and brand kits to build consistent digital experiences quickly and confidently. To access it, in the navigation menu, click **Design**. ![Screenshot of the Design tab.](https://doc.sitecore.com/api/markdown-image/sai/en/users/sitecoreai/images/DSmodeling.png) ## Design options The left sidebar in **Design** provides the core tools and actions for or creating, managing, and styling design elements: ### Overview View all your design work in one place, including total, draft, and live components and forms. - Check how many components and forms you have. - Click **View all** to open the full list of forms or components. - Get started by customizing [visualization values](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio/visualize-components-in-the-design-studio/understanding-visualization-values-and-data-sources.html "Understanding visualization values and data sources") or [creating variants with AI](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio/generate-variants-of-a-component-with-ai.html "Generate variants of a component with AI"). - Use the [Agentic studio widget](https://doc.sitecore.com/sai/en/users/sitecoreai/sitecoreai/navigating-the-interface.html#UUID-2e2a8a4e-363b-7de4-a7e0-1bf77d3e048c_section-id235183034116784 "Agentic studio widget") to access the features in the Agentic studio. > [!important] > To use the agentic features, ensure Stream is enabled in the Sitecore Cloud Portal and that you have been added as a Stream user. If Stream isn't enabled yet, click Enable Stream in Cloud Portal and follow the on-screen instructions. ### Design Studio Use the [Design studio](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio.html "Design studio") to view and test components for your site, as well as to create variants for existing components using AI: - [Visualize](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio/visualize-components-in-the-design-studio.html "Visualize components in the Design studio") and test components in a centralized workspace. - [Experiment](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio/experiment-with-components-in-inspect-mode.html "Experiment with components in Inspect mode") with design and content variations. - [Generate](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio/generate-variants-of-a-component-with-ai.html "Generate variants of a component with AI") new component variants using AI tools. - [Access the code](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/design-studio/view-and-edit-the-code-from-a-component.html "View and edit the code from a component") of your component. ### Forms Create simple, user-friendly [forms](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/forms.html "Forms") that fit your site’s design. - [Build](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/forms/create-a-form.html "Create a form") a form from scratch or use a ready-made template. - Change [field types](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/forms/designing-forms/work-with-field-items.html "Work with field items") and [layout](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/forms/designing-forms/work-with-form-layouts.html "Work with form layouts") easily. - Connect forms to other tools using [webhooks](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/forms/working-with-forms-dashboards/work-with-the-webhooks-dashboard.html "Work with the webhooks dashboard") instead of storing user data. - [Activate](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/forms/activate-a-form.html "Activate a form") and use forms directly in the Page builder. ### Brand kits Use [brand kits](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits.html "Brand kits") to make sure AI-generated content aligns to your brand guidelines. - Start build your [brand knowledge](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits/brand-knowledge.html "Brand knowledge") by [creating a brand kit](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits/create-a-brand-kit.html "Create a brand kit") for your organization or brands. - [Upload brand documents](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits/create-a-brand-kit.html "Create a brand kit") following our [best practices](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits/guidelines-for-uploading-brand-documents.html "Guidelines for uploading brand documents"). - [Add or remove users](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits/manage-brand-kit-access.html "Manage brand kit access") who can access your brand kits. - [Rename, edit or delete](https://doc.sitecore.com/sai/en/users/sitecoreai/design-components/brand-kits/manage-a-brand-kit-and-its-sources.html "Manage a brand kit and its sources") a brand kit and manage its source documents.