Skip links

How to create a cool Twitter background image

Twitter has recently become something of a necessity for most businesses.

 

Social media marketing is big business in the online world. It allows you to keep in touch with your clients and prospects, share information and is a great way to advertise your products or services.

 

With so many businesses and Twitter accounts around, why not stand out from the crowd with a bespoke Twitter design that will make a great first impression!

 

Having a professional looking Twitter page not only symbolises that your business is legit, but it also aids your company brand recognition.

 

This tutorial includes a visual step-by-step guide to creating your Twitter background image using Adobe Photoshop. If you plan on creating a background that is large enough not to tile (when the image repeats and repeats), then this tutorial is perfect for you!

 

1. GATHER IDEAS

 

Brainstorm some ideas and get creative on how you wish to visually convey what your business is about. If you struggle, you can also get inspiration from looking at other company pages on twitter!

 

Gather some eye catching imagery. You’ll also need a logo or a profile picture, and your brand assets to keep in-line with your brand identity. (colours, fonts, images etc)

 

A slogan and a list of your services are also good to include within your design, and don’t forget that your background can also include your contact details!

 

2. DESIGN

 

Next set up a new document in Photoshop (file / new… / type in below details / …and hit OK)

 

The standard Twitter image size is 1280 pixels x 800 pixels with resolution 72 pixels/inch. As our image is going to be viewed online, select RGB colour mode.

 

 

The 250 pixels on the left is your area to be creative.

 

We recommend it being 230 pixels so that your design doesn’t hide behind the main twitter feed.

 

 

Your logo should appear in the top left corner ideally, as this traditionally is where the viewer will look first.

 

Twitter has changed its settings recently to give you the ability to add your design to the right & center too. If you choose this orientation your design will need to appear 230 pixels to the right of your canvas/art space.

 

As you can see from our design example (Hawk Conservancy Trust), we have used photographs that complement the brand in the 230 pixel space, we used assets that draw your attention to the contact details.

 

 

Your design can run behind the Twitter feed as the overlay is transparent in the gaps of the different twitter sections.

 

The right hand side of your design will need to fade into one background colour, as twitter requires a hex or hashtag colour palette value (for example #ffffff is white) to find out your hashtag colour value, select your eye-dropper in your toolbox and click on the colour area you wish to use.

 

 

 

Save your design for web (file / save for web & devices / optimised (top left) / 100% quality / save

 

 

3. UPLOAD

 

Go to www.twitter.com > login > settings > design and scroll to the bottom until you get to the design options.

 

Settings
Change background > go to existing image > find your document > open > un-tick ‘tile background’

 

Background position > choose left, center or right (left in our case)

 

Type in the hashtag colour value you noted before with the photoshop eye-dropper. This will also need to be replicated for link colour.

 

Choose your overlay colour, this will depend on the main colour of you brand (in our case white).

 

 

Save changes & enjoy…

 

Next time:

 

How to create a cool Twitter header image!

 

Oh and don’t forget to follow the One2create Twitter account for more hints, tips and cool information!

Leave a comment

  1. Very nice. Keep up the good work! the best article I found on Bing .