Jump to content

Custom background with css / Image

Go to solution Solved by SaranyaDesigns,

Recommended Posts

Howdy folks! Thanks for all the help so far with my website! I have another interesting question. Is it possible to create a seamless backround for the website using a custom PNG or image. I created a pixelated background for the website but im not sure how to put it in the background as a seamless pattern. I have attached a before and after of what id like it to look like. 




Link to comment
  • Solution

@Exileking ok so you'll need to upload the image to your site first and then find the direct url for it. then replace the url in the code below, but something like this should work, assuming you want it on all pages of the site? Add this to your custom CSS:

/* remove dark background from all sections of site */
body, .header, .page-section .section-border, :not(.has-background) .section-background {
	background-color: transparent !important;
/* add repeating seamless background image sitewide - replace url with locally hosted version of image file */
body {
    background-image: url(https://content.invisioncic.com/p289038/monthly_2023_11/Image.thumb.png.feabc75f3081e1db301ea993557e1567.png);
    background-repeat: repeat;

Let me know?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.