--- title: use-theme --- [Skip to content](https://nanobot.group/use-theme#main-content) [![Nanobot_logo](https://nanobot.group/hubfs/Logotype_color_black%20(4).svg "Nanobot_logo")](https://nanobot.group?hsLang=en) Contact us [![Nanobot_logo](https://nanobot.group/hubfs/Logotype_color_black%20(4).svg "Nanobot_logo")](https://nanobot.group?hsLang=en) Contact us # Use themes A [theme](https://www.hubspot.com/products/cms/website-themes-templates?hubs_content=knowledge.hubspot.com%2Fwebsite-pages%2Fuse-themes&hubs_content-cta=A%2Ftheme) is a set of templates, modules, global content, and style settings that can be used to create a website. You can edit pages and posts using a theme in the [content editor ](https://knowledge.hubspot.com/website-pages/edit-page-content-in-a-drag-and-drop-area)and set blog templates to use a theme in your [blog settings.](https://knowledge.hubspot.com/blog/manage-your-blog-template-and-settings)  All accounts have access to at least one default HubSpot theme. Themes can also be downloaded from the [Template Marketplace.](https://ecosystem.hubspot.com/marketplace/website) ## Understand themes A theme is a set of files for your website, including: - **Coded templates: **a set of templates for your website, including a homepage, about page, landing page, and blog templates. These templates are custom coded by a developer, but the content and layout can be customized in the [content editor](https://knowledge.hubspot.com/website-pages/edit-page-content-in-a-drag-and-drop-area).  - **Modules: **a set of unique theme modules you can add to content using that theme.  - **Global content:** content repeated on multiple pages, such as a website header or footer. You can [edit global content](https://knowledge.hubspot.com/design-manager/use-global-content-across-multiple-templates#edit-global-content-within-the-content-editor) directly from the drag and drop page editor. - **Theme settings:**[ style settings](https://knowledge.hubspot.com/website-pages/edit-your-global-theme-settings) for templates using a theme, including fonts, spacing, and colors. ## Use an active theme You can set an active theme to display that theme's pages as the default options for newly created pages. Setting or changing an active theme will not change the theme used for existing content, which requires [swapping the content's current template. ](https://knowledge.hubspot.com/design-manager/swap-and-edit-your-blog-email-or-page-template)Additional themes can be purchased in the [HubSpot Template Marketplace](https://knowledge.hubspot.com/resources/how-to-purchase-a-template).  - Navigate to your content: - **Website Pages**: In your HubSpot account, navigate to **Marketing** > **Website** > **Website Pages**. - **Landing Pages**: In your HubSpot account, navigate to **Marketing** > **Landing Pages**. - In the top right, click the **Create **dropdown menu and select **Website page **or **Landing page**. - In the dialog box, enter a **page name**, then click **Create page**. - On the theme selection screen, hover over a theme, then click **Preview theme** to open a preview of the theme or **Set as active theme** to use this theme as the default for your pages.  ![set-an-active-theme](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/set-an-active-theme.png?width=894&name=set-an-active-theme.png) After you set a theme, you’ll be brought to the template selection screen each time you create a new page. From this screen, you can switch to a different active theme: - Click the **Theme** dropdown menu and select **Change theme**. ### ![change-theme-in-hubspot](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/change-theme-in-hubspot.png?width=2270&name=change-theme-in-hubspot.png) - On the theme selection screen, hover over a theme, then click **Preview theme** to open a preview of the theme or **Set as active theme** to use this theme as the default for your pages.  ## Create a page using a theme - Navigate to your content: - **Website Pages**: In your HubSpot account, navigate to **Marketing** > **Website** > **Website Pages**. - **Landing Pages**: In your HubSpot account, navigate to **Marketing** > **Landing Pages**. - In the top right, click the **Create **dropdown menu and select **Website page **or **Landing page**. - In the dialog box, enter a **page name**, then click **Create page**. - On the template selection screen, templates from your active theme will appear in the *Theme templates *section. To view templates that aren't part of your active theme, click **Other templates**. - Hover over a template, then click **Preview template **to preview the template or **Select template **to continue to the content editor.  ![preview-or-select-template](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/preview-or-select-template.png?width=894&name=preview-or-select-template.png) - In the content editor, edit page content using the [drag and drop editor](https://knowledge.hubspot.com/website-pages/edit-page-content-in-a-drag-and-drop-area).  - To take your changes live, click **Publish **or **Update **in the top right, then click **Publish now **or **Update now **in the dialog box.  ## Apply a theme template to your blog You can set a blog to use the same theme as your pages in your blog settings. The blog post and blog listing page templates are selected separately.  - In your HubSpot account, click the settings **settings icon** in the main navigation bar. - In the left sidebar menu, navigate to **Website** > **Blog**. - If you have multiple blogs, click the **Select** **a blog to modify **dropdown menu and select a **blog**.  - Click the **Templates **tab. - In the *Blog Post Template *and *Blog Listing Page *sections, click the **Actions **dropdown menu and select **Change template**. ![change-blog-template](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/change-blog-template.png?width=384&name=change-blog-template.png) - On the theme selection screen, select your **theme**, then select a **template **using that theme. In the bottom right, click **Done**.  ![select-a-theme-blog-template](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/select-a-theme-blog-template.gif?width=1440&name=select-a-theme-blog-template.gif) - When you've set the blog post and blog listing page templates, click **Save **in the bottom left.  **Please note:** for blog listing pages that can be [edited in the content editor](https://knowledge.hubspot.com/blog/edit-a-blog-listing-page), these steps will lead to the content editor instead of the theme selection screen.  Edit theme settings You can customize the styling of your theme - including font, colors, and spacing - in your theme settings. Styles edited here apply to all pages and theme modules included in this theme. Learn more about [managing theme settings](https://knowledge.hubspot.com/website-pages/edit-your-global-theme-settings). ![edit-global-theme-fonts](https://2832391.fs1.hubspotusercontent-na1.net/hub/2832391/hubfs/Marketing/Website/Website-Pages/edit-global-theme-fonts.png?width=342&name=edit-global-theme-fonts.png) ## Manage themes In the design manager, you can edit, clone, or copy a theme to another HubSpot account. You can also delete default HubSpot themes, cloned themes, and custom themes, as well as create child themes.  ### Clone a theme To edit the coded files of default themes in the design manager, they must first be cloned. Themes purchased from the [Template Marketplace](https://ecosystem.hubspot.com/marketplace/website) cannot be cloned; it's recommended to [create a child theme ](https://knowledge.hubspot.com/website-pages/use-themes#create-a-child-theme)instead.  - In your HubSpot account, navigate to **Marketing** > **Files and Templates** > **Design Tools**. - In the finder, click the **@hubspot** folder. This folder contains all themes and default modules, including [drag and drop email modules](https://knowledge.hubspot.com/email/create-marketing-emails-in-the-drag-and-drop-email-editor).  ![design-manager-hubspot-folder](https://2832391.fs1.hubspotusercontent-na1.net/hub/2832391/hubfs/Marketing/Files-and-Templates/Design-Tools/design-manager-hubspot-folder.png?width=242&name=design-manager-hubspot-folder.png) - Right click a **theme** **folder**, then select **Clone theme**.  ![design-manager-theme-folder-clone](https://2832391.fs1.hubspotusercontent-na1.net/hub/2832391/hubfs/Marketing/Files-and-Templates/Design-Tools/design-manager-theme-folder-clone.png?width=239&name=design-manager-theme-folder-clone.png) - In the dialog box, enter a **name** for the theme, then click **Create**. The theme will be copied into the root folder and will be listed in the finder with your other folders.  ### Create a child theme In the design manager, you can create a child theme - a copy of a purchased theme - based on a purchased [Template Marketplace](https://knowledge.hubspot.com/resources/how-to-purchase-a-template) theme or a default HubSpot theme.  Developers can also [create child themes based on custom themes](https://developers.hubspot.com/docs/cms/building-blocks/themes/child-themes#create-a-child-theme-for-a-non-marketplace-theme-in-the-design-manager) and [create child themes using the CLI](https://developers.hubspot.com/docs/cms/building-blocks/themes/child-themes#create-a-child-theme-with-the-cli) using our developer documentation. Learn more about [working with child themes](https://developers.hubspot.com/docs/cms/building-blocks/themes/child-themes).  - In your HubSpot account, navigate to **Marketing** > **Files and Templates** > **Design Tools**. - In the finder, click the **@marketplace **folder for Template Marketplace themes or the **@hubspot **folder for default themes.  - Right click a **theme folder**, then select **Create child theme**.  - In the dialog box, enter a **name **for the child theme. - To change where the child theme will be saved, click **Change **in the *File location* section. Click a **folder**, then click **Select**. - To customize the names of the theme's CSS and JS files, click **Advanced options**, then enter new **file names** in the *CSS *and *JS *fields.  - To finish the process, click **Create child theme**. You can [edit the styling](https://knowledge.hubspot.com/website-pages/edit-your-global-theme-settings) for the child theme in the content editor.  ### Copy a theme to another account You can copy a theme folder from one account to another. You must be a user with [*Design tools* permissions](https://knowledge.hubspot.com/settings/hubspot-user-permissions-guide#marketing) in both accounts. **Please note:** theme folders in the @hubspot or @marketplace directories cannot be copied between accounts. To copy a theme to an account: - In your HubSpot account, navigate to **Marketing** > **Files and Templates** > **Design Tools**. - In the finder, hover over the **theme folder** that you want to copy, then right-click the **folder** and select **Copy to different account**.  ![copy-theme-folder-to-different-account](https://2832391.fs1.hubspotusercontent-na1.net/hub/2832391/hubfs/Marketing/Files-and-Templates/Design-Tools/copy-theme-folder-to-different-account.png?width=343&name=copy-theme-folder-to-different-account.png) - In the dialog box, select an **account**, then click **Copy asset**. The folder will appear in the specified account as soon as the copying process finishes.  ### Upload a theme Users in *CMS Hub *accounts can purchase HubSpot themes from Envato's ThemeForest Marketplace, then upload them into HubSpot from the theme selection screen:  - Navigate to the [*HubSpot CMS Hub* section ](https://themeforest.net/category/cms-themes/hubspot-cms-hub)of Envato's ThemeForest Marketplace.  - [Purchase a theme](https://help.market.envato.com/hc/en-us/articles/203269700-How-do-I-purchase-an-item-) from the marketplace. - You will receive an email with a purchase code for your purchased theme. Copy the purchase code.  ![copy-your-envato-purchase-code](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/copy-your-envato-purchase-code.png?width=849&name=copy-your-envato-purchase-code.png) - Navigate to your content: - **Website Pages**: In your HubSpot account, navigate to **Marketing** > **Website** > **Website Pages**. - **Landing Pages**: In your HubSpot account, navigate to **Marketing** > **Landing Pages**. - In the top right, click the **Create **dropdown menu and select **Website page **or **Landing page**.  - In the dialog box, enter a **page name** and click **Create page**.  - On the template selection screen, click the **Theme **dropdown menu and select **Change theme**.  ![change-theme-in-hubspot](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/change-theme-in-hubspot.png?width=2270&name=change-theme-in-hubspot.png) - In the top right, click **Install a theme from ThemeForest**. ![install-a-theme-from-themeforest](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/install-a-theme-from-themeforest.png?width=2360&name=install-a-theme-from-themeforest.png) - In the dialog box, paste the **purchase code **from the email, then click **Install theme**.  - In the new tab, log into Envato's ThemeForest Marketplace to finish the installation process.  When you have successfully logged in, a banner will appear in HubSpot. It may take a few minutes for your theme to be available.  ![upload-theme](https://knowledge.hubspot.com/hs-fs/hubfs/Knowledge_Base_2021/upload-theme.png?width=1437&name=upload-theme.png) ### Delete a theme Default HubSpot themes, cloned themes, and uploaded themes can be deleted from the design manager: - In your HubSpot account, navigate to **Marketing** > **Files and Templates** > **Design Tools**. - In the [finder](https://knowledge.hubspot.com/design-manager/a-quick-tour-of-the-design-manager), click the folder with the theme's assets. - Click the **File **dropdown menu and select **Delete \[folder name\]**.  - In the dialog box, select the **I am sure that I want to delete this folder **checkbox, then click **Delete this folder**.  Purchased themes must be uninstalled from the Template Marketplace:  - In your HubSpot account, click the marketplace **Marketplace icon** in the main navigation bar, then select **Asset Marketplace**. - Click the **Purchased **tab.  - Hover over the theme, then click the **Actions **dropdown menu and select **Uninstall**.  - In the dialog box, click **Uninstall**.     [Follow us on Facebook](https://www.facebook.com/Nanobot.Medical.Animation/) [Follow us on LinkedIn](https://www.linkedin.com/company/9192425/) [Follow us on Twitter](https://twitter.com/Nanobot_Studio) [Follow us on Instagram](https://www.instagram.com/nanobot_medical_animation/) [Follow us on Facebook](https://www.youtube.com/user/Nanobotmodels) [Follow us on Facebook](https://www.pinterest.com/nanobot_studio/) --- [![Absolut theme logo](https://nanobot.group/hs-fs/hubfs/raw_assets/public/@marketplace/Kohorta/Absolut/images/brand/absolut-logomark-nobg.png?width=30&height=37&name=absolut-logomark-nobg.png "Absolut theme logo")](https://nanobot.group?hsLang=en) Nanobot Medical Communication©Copyright 2022. All rights reserved