SM Folder

1 | Select the right folder
In the Custom CSS window, scroll down until you find the "SM Folder" section. You'll see a lot of CSS variables: The one you're looking for is @sm-folder-number:3;— this controls which folder is being customized with icons. If you only have one folder, change it to 1.

2 | Pick your icons
Icons are not included (except for the default template ones), so you’ll need to make or download your own. I recommend thenounproject.com for easy, high-quality icons. Alternatively, Untitled UI is what's being used as the placeholder icons, which I'm a huge fan of.

Tip 1: Make sure you download files in the exact color you’ll be using, since you can’t change it later.
Tip 2: Make sure to use SVG files and not PNG, as they'll appear much sharper and with a much smaller file size.

3 | Upload to Squarespace
Squarespace doesn't allow for SVG files to be uploaded via the standard Custom CSS file upload section, so we'll have to do a slight workaround to upload and access your icons. First, in the Pages menu, add a new "Link" (bottom of the list) and open up the settings. You'll see the window below: Click the up arrow to add your icon and save. You'll see the icon link listed, so all you have to do is click the "copy" button to grab the link's unique URL.

4 | Reference in Custom CSS
Now that you have the URL of the icon, it's time to add it to the correct folder link. Still in the "SM Folder" area, navigate to the first link you want to change. Select the URL highlighted in green below (leave the quote marks!) and paste in your copied icon link. It should override what's there, but just make sure there's only one link present. After you do this, you should see the corresponding icon appear for the link in your folder.

5 | Add a Description
Lastly, update the description text underneath each link. Just select the text outlined in blue above (again, not the quotes!) and replace it with your own. This should update immediately. All that's left is to repeat for all links in your folder!