All About Tumblr Backgrounds

by • Aug. 18, 2010 • Freebies, Recent Blog Posts, Resources, Tumblr • Comments (5) • 9764

The reason way I love as a content management system because of how simple it is to use and customize. One of the easiest ways to spruce up your current Tumblr template is to change your Tumblr background image. Easy enough, right? So today’s post is dedicated to helping you find some cool Tumblr backgrounds and show you how to install it.

Why Should I Change My Background?

There are hundreds (if not thousands) of Tumblr templates available online and the best way to set your tumblog apart from all the rest is by changing your Tumblr background. A new background image can easily add a bright and interesting look to your Tumblr template without much effort.

200+ Free Tumblr Backgrounds

Here I have complied a list of more than 200 hundred free Tumblr backgrounds which can be downloaded and installed into your theme within minutes.

GypsyGarden (1 pattern)

Pattern 2 (14 patterns)

Patterns 2 (6 patterns)

Textured Stripes (6 patterns)

Photoshop Pattern (4 patterns)

Pattern Part1 (9 patterns)

Patterns .24 (33 patterns)

Lace Patterns: the prelude (6 patterns)

Untitled patterns 03 (12 patterns)

Patterns .23 (33 patterns)

Green Patterns (6 patterns)

Patterns .27 (50 patterns)

Patterns 3 (6 patterns)

Softly Plaidly- Peachy Keen (11 patterns)

Black – White patterns (13 patterns)

PINKgossip_04 patterns (13 patterns)

Additional Tumblr Background Image Resources

How to Change a Tumblr Background

Now that you have picked out your new Tumblr background and downloaded it to your local computer, it’s time to add it to your theme. There are two ways to add a background to your Tumblr theme. I will discuss them both below.

Option 1: Appearance Panel

If you can add a new background through your Tumblr Customize > Appearance Panel choose this option.

  1. Login into your Tumblr account and click in the right side of your dashboard.
  2. When the customization section opens, click APPEARANCE at the top of the page.
  3. When the panel opens you simply click the UPLOAD button to select your theme from your local computer and you’re done! If you have the option for repeating your background choose “repeat-y” if you pattern needs to repeat vertically (from top to bottom). Select “repeat-x”, if you background need to repeat horizontally (from left to right). Choose “repeat-xy”, if you image needs to repeat both vertically and horizontally. You can also choose “no-repeat”, if you have a really large background image that doesn’t need to be repeated.

Option 2: Hand-coding Custom HTML

Use this option if you do not have the Tumblr Appearance Panel available with your theme.

  1. Login into your Tumblr account
  2. You will need to upload your new background image onto
  3. After uploading your file, make note of your image url. You can copy it to NotePad or SimpleText for safe keeping.
  4. Return to your Tumblr Dashboard and click in the right side of your dashboard.
  5. Select THEME from the top menu.Click the USE CUSTOM HTML buttonLook for the BODY tags. This is the code we will be editing. (Your coding won’t be exactly like this, so you should look for something similar near the top of the code.)

    body {  background: #f8f7e5 url(wdw-bg.jpg) no-repeat center top  }

  6. Paste your image url  into the CSS
    body {  background: #f8f7e5 url(http://safe.tumblr.com/theme/3383425/) no-repeat center top  }
  7. You may need to adjust your background image by changing your background color and whether it repeats or not.
     body {  background: #f8f7e5 url(http://safe.tumblr.com/theme/3383425/) no-repeat center top  }

    Choose “repeat-y” if you pattern needs to repeat vertically (from top to bottom). Select “repeat-x”, if you background need to repeat horizontally (from left to right). Choose “repeat-xy”, if you image needs to repeat both vertically and horizontally. You can also choose “no-repeat”, if you have a really large background image that doesn’t need to be repeated.

  8. Click the UPDATE PREVIEW button in order to see your changes.
  9. If you are satisfied with the results click the green SAVE & CLOSE button at the top right of the page.
  10. Your Done!

Additional Resources
  • http://www.homenotion.com/blog/7285/xsitepro-review-best-website-software-of-choice/ liz@internet home business ideas

    Love those backgrounds, just make sure that your copy is on white space. So many folks like to type over certain color backgrounds which makes it hard to read :-)

  • Veronique

    Hi,
    I have one problem that prevents me from doing things creatively on my Tumblr.
    When I upload an image it does not provide the options of repeat or no repeat and every time I try HTML/CSS it either shows the original theme or only the background colour.
    What am I doing wrong? Or is there something wrong with my tumblr?
    Thanks.

  • arsha

    Hi Veronique! The theme you are using may not offer “repeat or no repeat” as an option. The only way to change it is to hand code the theme. Go to your Tumble Dashboard and click the CUSTOMIZE link. Under theme THEME tab click the “USE CUSTOM HTML” button. Near the top should be a snippet of code similar to this:

    body {
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    background:{color:background} url({image:background}) no-repeat center top;
    background-repeat:{text:BackgroundRepeat};
    background-attachment: fixed;
    }

    Look for the styling information related to the background and add the code in bold type to your theme. Then add the following to the META area of your stylesheet (right above the background styling):

    < meta name="text:BackgroundRepeat" content="no-repeat" >

    Update the preview and once you click the APPEARANCE tab you should be able to change those options. – Arsha

  • Indigo-Rain

    How Long Do You Have To Make The Background When Making Your Own?

  • http://adorebeautynina andreina compres

    i want to make my tumblr with a background of my picture in the bacc ,