How To Round The Corners on Squarespace Video Block

Sep 29

Written By Toni Williams - Founder of The Square Genius

guide on how to round the corners of Squarespace video blocks

Round the corners on your Squarespace Video Block

Want to round the edges of videos on Squarespace but can’t find the option? You’re not alone. By default, Squarespace doesn’t let you add rounded corners to video blocks—whether you’re uploading directly or embedding from YouTube or Vimeo. Luckily, there’s a simple fix! In this guide, I’ll show you how to adjust the Squarespace video format with a few lines of CSS so your Squarespace video block looks polished with beautifully rounded corners.

preview of videos with rounded corners on Squarespace websites

CSS Code For Video Block With Uploaded Link (Youtube/Vimeo)

Go to pages > scroll down to custom code > Custom CSS - Then paste the below code


/* Round corners on Video Blocks (YouTube, Vimeo, etc.) */
.sqs-block-video iframe {
  border-radius: 15px;  /* adjust to taste */
  overflow: hidden;  
}
.sqs-block-video .sqs-video-wrapper {
  border-radius: 15px;
  overflow: hidden; 
}

CSS Code For Video Block With Uploaded Videos

Go to pages > scroll down to custom code > Custom CSS - Then paste the below code


/* Round Corners On Uploaded Videos */
.video-player .plyr .plyr__controls:before
{display:none!important;}

.plyr__video-wrapper video, .plyr__video-wrapper
{border-radius:10px !important;
}

And that’s it,your Squarespace video block now has rounded corners! This quick CSS tweak works for both embedded and uploaded videos, giving you more control over the Squarespace video format. With rounded edges, your videos can blend seamlessly into your site design and look more professional. Try it out and see how a small style change can make a big visual impact.

Check out my Squarespace Premium Plugins

preview of a timline plugin for Squarespace websites — **Premium Timeline** Plugin

Featured

How To Round The Corners on Squarespace Video Block

10 Squarespace Plugins I Cant Live Without

How to Add a Simple Squarespace Vertical Timeline

timeline squarespace

Toni Williams - Founder of The Square Genius

Hi, I’m Toni. My mission is to create powerful websites for charities, non profits and purpose-led organisations dedicated to making a positive impact on the environment, communities, animal welfare and many more. I am also a CSS enthusiast and love to create cool plugins for Squarespace websites.

https://www.thesquaregenius.com/author-toni-williams