How do I find out what the CSS structure is for Squarespace?

It seems that any CSS code depends on addressing the elements particular to square space, such as the various blocks. Is there a place to find a listing of all the blocks and other elements that can be modified with CSS?

2 minutes ago, Tiernan said:

Is there a place to find a listing of all the blocks and other elements that can be modified with CSS?

It isn't practical to produce a list. This is because:

• Squarespace make frequent undocumented changes.
• Some classes are generated dynamically as each page is served to the user.
• Elements will be different between sites and pages because each element will be changed when it is tweaked in Block Editors, Section Editors, Page Editors and Site Styles.

If you need assistance identifying them, I recommend watching a video of someone using the browser development tools to change something within Squarespace and go from there.

Thanks for your feedback, Paul. Where might I find these videos?

I found your guide here helpful. https://sf.digital/squarespace-solutions/adding-css-how-to-find-id-and-class-selectors-on-squarespace

Developer Heather Tovey created a chrome extension specifically for finding various Squarespace IDs (such as blocks, sections, collections, etc.). I've been using it for several years now, and it's a huge timesaver. A must-have for anyone who builds with Squarespace.

Link: https://chrome.google.com/webstore/detail/squarespace-id-finder/igjamfnifnkmecjidfbdipieoaeghcff

That's really neat, thank you for pointing that out!