How to change a bullet point to a custom symbol on Squarespace (Super simple!)

In today's Squarespace tutorial, we'll explore a straightforward method to personalize your bullet points with custom symbols of your choice. Follow along to enhance the visual appeal of your Squarespace website effortlessly.

Watch the Video

Check out the YouTube video below 👇

Changing a bullet point to a custom symbol: STep by step guide

Step 1: Choose Your Symbol

Begin by visiting a symbol website like Fsymbols.com to select your desired symbol. You can browse through a variety of options and simply click to copy the symbol to your clipboard. This could be anything from check marks to arrows or emojis.

Step 2: Create Bullet Points

Navigate to your Squarespace website and access the page where you want to customize bullet points. Add a text block and click on the bullet point icon to start creating your list. Input the text as needed, such as list items or key points.

Step 3: Apply Custom Symbol with CSS

Copy the provided CSS code and access your Squarespace's Custom CSS area by typing "/CSS" in your browser. Paste the CSS code into the designated area and save your changes.

li>*:first-child::before{content:""!important;color:#333}

Step 4: Insert Symbol and Customize Color

Return to your text block with bullet points. As you've applied the CSS, the default bullet points will disappear. Now, paste the symbol you copied earlier between the quotation marks or where the red box is in the photo below. You can also customize the symbol's color using hex codes or specific color names.

Congratulations! You've successfully customized your Squarespace bullet points with custom symbols, adding a unique touch to your website's design. Experiment with different symbols and colors to match your site's aesthetics. Don't forget to subscribe to the Youtube channel for more Squarespace tips, and stay tuned for our next tutorial. See you next time!


Your Designer

I’m Wesley, a Squarespace website designer. I’ve created amazing websites for multiple clients across different industries from Education sites to Wellness brands to Accounting Firms. If you’re looking for a website and want to discuss a potential project, email me at wesley@websleydesign.com. You can also schedule a free 15-minute consultation call

Previous
Previous

How to Easily Add a Gradient Line to Your Squarespace Website

Next
Next

How to Embed a YouTube Video on Your Squarespace Website