Squarespace Site Styles | Choosing Templates, Colors, Fonts, and More

In this video, you'll learn how to change your site styles in Squarespace. This includes changing your template, colors, fonts, and more. Download the FREE and fillable website design checklist👇 https://www.clintmally.com/squarespac... Check out the full list of courses👇 https://www.clintmally.com/squarespac... Choosing Your Font in Squarespace 7.1 You’ll need one font for your headings and one for your body text. To change your heading font, click the arrow next to “Headings” and select your font. Click the arrow next to "Families," then click “Browse All Fonts." Here you can scroll to choose a font or just search for it in the search bar. You’ll notice that as you change your font you can see how they look on the left. Follow the same steps for your paragraph font. Change your button font, too. I like to make my button font the same as my header font. No matter which font you choose, the most important thing is that it is readable. Big, fancy writing may look cool, but if it’s hard to read, your site visitors will just go somewhere else. How to Change Your Site Colors in Site Styles for Squarespace 7.1 First, exit out of the style menu, hover over the top of your section and click the "Copy" button. Do this 2 more times until you have four sections total. Next, click the paintbrush icon again, click “Colors” on the site styles menu. You’ll see you have a palette and your themes below. Click "Edit Palette." Now, you have a few different options. You can enter the hex code for each color that you want at the top for up to 5 colors, starting with the lightest on the left to the darkest on the right. I recommend everyone's lightest left-hand text be white. If you don’t already have a color palette for your business, think about a brand you love that is outside of your industry. It’s totally okay to steal their colors, especially if they are not in the space of your product or service. No one has a copyright on colors. If you don’t know the hex code of colors that you like then download the free color pick eyedropper extension for Chrome. All you have to do is hover over the color on a web page and it will give you the exact hex code. I use this all the time. Or, you can use Coolors.co. Use their generator to get some great ideas with their hex code. Another option is to choose from a variety of presets that designers have set out for you. Last, you can upload an image, like a logo, and Squarespace will automatically pull out your color palette for you. Once you have your color palette, it’s time to test out how the colors look on your site. Close out of your site styles. Hover over the top of your first section and click the pencil icon, then go to "Colors." Start with "Lightest," scroll down and change it to "Light," then "Dark," and "Darkest." These are the main four sections you will probably use over and over. There are other ways you can change your background color outside of your color palette that I’ll talk about later on, but for now, it’s good to have a baseline of what your go-to sections can look like. Note: You can also change your button colors, or change the specific styles for a style section or color theme. To do this, first, go to the section you want to change. Click into it. Click the style icon paintbrush. Here you can change the color, size and shape of buttons. Remember: Button fonts are changed under "Fonts." Also remember that whatever you change here will impact every place where that style is in use on your site, which is why it's good to do it ahead of time. Later, when we want to customize image blocks, you can style them here, too, under "Image Blocks." More on that later. #Squarespacetutorial #Squarespacewebdesign #Squarespace