Content > Design Manager
From your HubSpot Dashboard, click on Content > Design Manager.
Create new template
Once you're in Design Manager, click the blue button in the top-right to create a New template.
Template Builder > Email
From the next window that appears, we want to choose Template Builder (this will give us easy drag-and-drop modules to construct a template without having to use any sort of code) and then Email. After you choose those two options, click Create.
Save and name email
Next you'll want to give your file a name and then choose in which folder you'd like your template to live. You also can create a New folder to create a new folder where this template can live. Once you've made your decisions here, click Save.
Navigating your email template
You're now within the new email template you created. You'll notice that, by default, HubSpot has added in some modules into your template. By choosing "Email" earlier when creating a new template, HubSpot recognizes that certain modules live within email templates that aren't going to be in templates for web pages or landing pages. Let's take a quick look at the basic layout of our email template:
Customizing your template
If you click Add Row, you can add additional modules and drag them to the location of your choice. This template is highly customizable and you'll see on the left-hand side of the Template Builder that you have many other modules you can add to your email template to spice it up a bit. You can hover over any of these modules you may want to add and drop them onto your template layout, then drop them where you'd like them to be within your email template.
There are so many things you can do within the Template Builder, from adding or removing modules to changing the width of your columns. Check out this detailed article on structuring the content within your email template.
As mentioned before, email templates are a little unique. There are some restrictions to what you can do. Unlike web pages, you can't use an attached stylesheet (CSS file) to style an email because this isn't entirely supported across web clients. So in order to customize the styling of your email you'll want do inline styling and there are a couple places you can do this within an email template.
Module > Edit CSS
Each module in your template has the ability to have its own unique styling. This can be helpful if you want to apply styling only to a specific area of your email template.
Within your email template, navigate to and click on the gear within your Main Email Body module, then choose Edit CSS.
Within the Edit CSS window, you can change all of the following (which will be applied to content that lives only within this module):
Layout and Preview
Within your email template, you also have two main views: Layout and Preview. The Layout view will show you what your email templates look on a modular level and will be where you will do all of your edits to your email template.
Once you've had some time to tinker around with your email template and you think you're happy with the look of it, you can click the Preview button to see what your email will look like to your contacts. In the Preview screen, you can also click Preview Options to view your preview as if it were on other devices, like on a tablet or mobile phone.