Everything you need to know about migrating your website from WordPress to HubSpot.

This step-by-step visual guide will walk you through the process and help get your website all set up on HubSpot.


Download Now


    Everything you need to get started with HubSpot's CMS and build your CLEAN website.

    No developer is needed.  This complete 3-part series includes a step-by-step guide to high-fives all around the office.


    Download the Guides

      The CLEAN Theme

      Take full advantage of the new and improved HubSpot CMS experience with the CLEAN theme.

      Theme Support & Reference

      Have a question and looking for an answer? I've likely got a video for that or an article that covers it.

      Built for Speed, Performance, AND an awesome UX.

      Google PageSpeed Insights is the gold standard in analyzing the speed and performance of a website. Here is how CLEAN Pro ranks. Not too shabby for a media-rich page.


      Report generated: Tues, March 7, 2023, based on Home Page - Opt 1.

        1 min read

        At last! The CLEAN Pro Figma file is here.

        At last! The CLEAN Pro Figma file is here.

        Table of Contents

        To all my fellow designers out there, this one is for you. Today, I'm excited to announce the release of version 1.0 of the CLEAN Pro Figma file. You've been asking for it and I'm happy to finally make it a reality in an effort to help streamline your design workflow.

        What to expect.

        Like my approach with CLEAN, this Figma file will be a constant work in progress with consistent version updates over time.  Version 1.0 is intended to get you movin' and groovin' in your wireframe process with a majority (not all) of the existing CLEAN modules.

        Download CLEAN Figma



        The basics.

        When opening the Figma file for the first time you'll see the Pages section under the Layers tab. I've done my best to make this as intuitive as possible. 


        Screenshot 2023-04-05 at 2.07.26 PM


        For the most part, you can start building layouts by clicking Start Designing Here. That will include a starter layout with the header, footer, hero banner, and magic module.  These are really just placeholders to give you a starting point.


        Screenshot 2023-04-05 at 2.11.37 PM


        From there I would suggest that you head over to the Theme Settings (Brand style) to dial in your fonts, buttons, and colors that many of the components (modules) will use. Here you'll be able to change a variety of aspects. This is just one example.


        Screenshot 2023-04-05 at 2.15.06 PM

        Adding components (modules) to your layout.

        There are a couple of ways to do this but the way I suggest to avoid confusion is to simply click the Assets tab in the left-side panel to see the list of custom modules included.

        Simply drag them into your layout.


        Screenshot 2023-04-05 at 2.19.06 PM


        The same can be done for smaller elements like buttons, form elements, etc.


        Screenshot 2023-04-05 at 2.20.16 PM

        Adjusting the column structure

        As you know, CLEAN modules have a lot of built-in flexibility when it comes to selecting how many columns you want as well as the column structure.  Building all these options into a Figma component is nearly impossible but there are a few options for you to use.

        When double-clicking on a component you'll see some options appear in the right sidebar. For example, the number of columns.


        Screenshot 2023-04-05 at 2.23.35 PM


        Definitely explore these.  They aren't perfect but they will definitely save you some time.


        Have feedback?

        As I said, this is the first release of this Figma file and it's only going to get better from here on out. This is where I need your help.  If you see anything that can be improved, I would really appreciate you letting me know.

        Together we can make this awesome and give you yet another tool in your design arsenal.


        5 Things to Ask Before Creating Your Website

        5 Things to Ask Before Creating Your Website

        Ready for your big and exciting new website design? Before diving into the fun of drag-and-drop editors and page layouts, make sure you’re building...

        Read More
        Which is right for you? HubSpot vs. WordPress vs. Squarespace.

        Which is right for you? HubSpot vs. WordPress vs. Squarespace.

        Wondering which website platform is right for you? I’m here to help you weigh the pros and cons of a few key players: WordPress, Squarespace, and the...

        Read More
        Web Designers vs. Developers: Which do You Need?

        Web Designers vs. Developers: Which do You Need?

        Ready for a new website? You may consider outsourcing to a designer or developer (or both)*. Read on (or take this quick quiz) to learn the...

        Read More