Slanted Text Effect


Step One

From your Squarespace account, go to the Custom CSS Editor: Design > Advanced > Custom CSS

Step Two

Copy and paste the code below into the Custom CSS Editor box.

// Slanted Text Effect //

h1:hover {
transform: skewX(-15deg);
transition:transform .3s ease-in-out;
color: #66D796 !important;

h1 {
transition:transform .3s ease-in-out;

Step Three

Change the h1 header property to the one you are targeting - this can either be h1, h2, or h3. Adjust color and transform angle.

If you’d like to target a specific block, add the block ID before h1. Download Squarespace Collection/Block Identifier to help make finding and copying block IDs easier.

Save and refresh the page. 👍

Moov Labs