Facebook Timeline Cover Template PSD for Photoshop
Facebook Timeline Template Design Sandbox Transparent .PNG
I love the opportunities for creativity within the design constraints of the new Facebook Timeline Cover. I created a Facebook Timeline Cover photoshop template you can download for free (right-click and choose Save File As). It’s a sandbox to play around with design ideas for your Facebook Timeline.
A Timeline Cover has two elements: Your profile photo is the same as before. It’s a 125 x 125 square. The Cover is the new edition and has a resolution of 851 × 315.
Facebook Profile Tips
I like to create Facebook Profile photos in photoshop because it’s easier to control exactly how that photo will look when it’s in that square box. Don’t upload a 125×125 image though. Make your profile photo square with a resolution of at least 800 x 800. Facebook will shrink it down, but when your friends and followers click on it, you want them to be able to see a full-sized photo in great resolution. Your profile photo is contained in a white frame that can be used as a design element that you play with in in relation to it’s place in front of your Timeline Cover photo.
Timeline Cover Tips
The size of Timeline Cover is 851 x 314. When you upload a cover image, you can adjust it up or down, but not left or right, so if you’re using a larger image keep in mind Facebook will use the full width of the photo, but only 314 pixels of it’s hight. I was playing with a Timeline Cover design for Geoff Smith‘s page where he has a very cool profile photo. I put a photo of his daughter holding his baby boy in the Cover space. One photo didn’t work because his daughter’s face was too far from his son’s face. It was an awesome photo, but it didn’t work within the constants of the Timeline Cover space. I found another photo that worked great.
The advantage of working out your design in a Photoshop sandbox is that you avoid uploading lots of Cover images to Facebook that you ultimately end up not liking.
Right-click to download the Facebook Timeline Cover Template PSD for Photoshop here (right-click and choose Save File As) or the Facebook Timeline Cover Template Transparent.png here.
UPDATE: I created a simpler template for just working out and saving new Cover art.
Right-click to download the simpler template PSD.
Here are some of the coolest Timeline Cover designs I’ve found to inspire you…
When you’ve got your Facebook Timeline Cover looking awesome, I’d love it if you shared a link in comments!
UPDATE: I made some new very simple templates you can download here.
Latest posts by Neal Campbell (see all)
- Watch Live As New Pope Emerges - March 13, 2013
- Help Me Fund OpenDoor.IM - February 23, 2013
- Steven Tyler Spent $6 Million on Drugs - February 23, 2013
Hey Neal,
Thanks for sharing the PSD. I noticed something off when choosing the cover photo though. The cover photo appears as a low quality image with really bad artifacts.
Is there any workaround for this? It can ruin a really good image.
Cheers,
Matt
What’s the resolution of the original image you’re working with? I would suggest getting the dimensions of the facebook timeline photo and making something that matches exactly. If that doesn’t work and fb is still compressing your image and making it look bad, that’s wack.
Facebook timeline is a great feature and this is a nice post, thanks! I shared it.
Actually it’s 851×315.
And as for the small image. Facebook won’t let you upload anything smaller than 180px wide. So you have to upload a 180×125 image to fit the small image exactly. So when you put your small image in the area to mock it up. Crop your image out then expand the canvas to 180pix wide and fill it with white (so essentially you have your image in the middle with white borders that are 27.5px wide on each side). Facebook will center that image right on your image, cropping out the extended white borders you added to fill up the 180px it requires to upload. Making it appear as if everything is how you intended it to be.
http://www.facebook.com/rohicks
Or i guess you could just upload the small image as 180×180, and it still should work. Regardless you can’t do anything below 180 wide if you use the method i described above or uploading 180×180.
These covers are awesome…!
I wish Facebook would not re-jpeg the images and lose the sharpness. Guessing they do that for size, but the lower quality is less than desired. Any optimization tips? My cover for 2012 New Years is up, just want a sharper image.
http://www.facebook.com/jminard
Use the template for creating the look, but upload larger images to Facebook. As long as you have the ratio the same, a larger image should give you the sharpness you’re wanting. Thanks for sharing your cover!
Neal, when I download the file and try to open in Photoshop it’s saying it’s not a valid file…
Older version of PS? The .png should work if the .psd doesn’t.
Just letting you know, the PS file is invalid…
Check my timeline facebook cover :: http://www.facebook.com/hermawan.aria.ji thanks before…
How do you get such clarity on your cover photo?
I’ve been experimenting for a long time now and I can’t figure it out
Use the template to create a design, but your two images have to be created independently in the right dimensions. An easy way to do that is to select the template layer to select the blank space, then move to the layer containing your cover image. Copy and then create a new image from clipboard. Save that as a .png and upload to Facebook.
The file worked just fine for me. CS5 on Windows.
Thanks Neal for your efforts and for sharing the inspiration of others’ facebook covers.
viewing it on Firefox it matches up but when you view it on your iPhone, it doesn’t =(.
I can’t use the PSD because when i download it i only saw a picture and to be exact it is a picture ! Plese help me or send me the Software Mr. Campbell because i want to enhance my editing skill ! I will be eternally great-full if you will send me the PSD. And im hoping for a positive response to this .
Thank you and God Bless
I’ve read from other websites that the dimesions are 851×315 instead of 850×314. Which one is right?
I think 851X315 is right.
OMG..!!! nice pic…how to download it?
How to download best photo design…
Ok, so I’m just playing around with the FB covers, yet when uploaded, the quality is lowered significantly – http://www.facebook.com/wickywills
I am going to include various 3D models, photos etc around my logo, however I obviously want to get my logo to appear as sharp as possible – currently the quality FB changes it to is shocking. Any way around this, or is it just something that I’ll have to live with?
Use the template as a sandbox for creating a look, but upload higher resolution photos.
or those of you having issues getting a good quality on Facebook, try these steps:
1. In Photoshop, go to “image” > “image size”
2. Change the measurements to “percent” instead of “pixels”
3. Make sure the height and width are linked and increase them to 150%
4. Select “OK”
This should change your image size to 1277×473. Export as JPG of PNG. I found them to be about the same quality once they were enlarged.
Hope this helps!
Thanks for the tip, Michael!
Michael has a great suggestion for the work around of getting higher resolution, but one thing to point out is that you need to make this adjustment to the overall template file BEFORE importing your photo. Otherwise if you import the photo, then change image size, your image will still b blurry since that would merely be enlarging a smaller sized photo.
A couple of comments on this. First, what about just creating the graphic in PNG format after you are done editing it out of Photoshop. Then upload to FB from that? Saving it as a PNG will keep it from being compressed too much prior to upload, and when you upload it, it should look much better.
Second, these layouts that people created are cool, but look at someones profile using Timelines on a mobile device, and the smaller profile graphic and the cover image do not like up anymore. I have discovered this on my page, after trying to alignment images with both, and then checking on my iPhone, the graphics are shifted so the design is lost. Not very good looking that way.
I created a graphic and used the psd template to have the right dimensions. I saved it as .png and .jpg at the right size and double the size. The quality in Facebook is lousy no matter what. What else should I try?
For those of you having issues getting a good quality on Facebook, try these steps:
1. In Photoshop, go to “image” > “image size”
2. Change the measurements to “percent” instead of “pixels”
3. Make sure the height and width are linked and increase them to 150%
4. Select “OK”
This should change your image size to 1277×473. Export as JPG of PNG. I found them to be about the same quality once they were enlarged.
Hope this helps!
No it doesn’t help Michael. Yes you’re uploading a little bigger photo which FB still compress. It may seem little better but that’s not it
Thanks For Sharing Such Wonderful Knowledge About Facebook Timeline Covers For Photoshop. We provide High quality FB covers Timeline. We Also Provide Huge Type Of Facebook Covers For You Guys To Use On Your Facebook Profile. You Can Also Get Latest Covers From Facebook Covers.
These are no doubt the best collection of Facebook Cover Pictures I’ve seen! – http://designfacebookcover.com/
comment on mine:
https://www.facebook.com/kreativmaestro
That was one of the better ones so far.
I made a template for GIMP and Paint.NET
http://lovershorizon.deviantart.com/art/Facebook-Timeline-Cover-XCF-PDN-PSD-Template-279030629
Awesome! Thanks for sharing!
Facebook covers facebook covers
here is my first cover
https://www.facebook.com/laloworld94fp
Thanks Neal for solving my sizing problem! Now my banners will be perfect as is my latest using your template and increasing the saturation before uploading. Wonderful, thank you and Happy Valentines to you and yours, Cheers, Freda
my facebook page is http://www.facebook.com/freda.hill
Thanks for the template, it made the sizing so much easier to do!!!!!
http://www.facebook.com/jason.connor
Very Cool !! Thank for templates
Some cool covers. Thought I’d try one as well…
My Profile
Thanks for the information! The images are a bit blurry but the effect is still pretty cool! http://www.facebook.com/profile.php?id=1238610016
Barbara
Thank you!
I think there is an issue with red color, and its shades. I don’t know why, but after testing different resolutions and file formats, reb backgrounds lose quality on the timeline.
I’m having problems with the cover photo quality also. I’ve tried uploading in the 850 x 314 pixel size in jpeg, gif and png format. But the quality becomes low once I upload the image and it loses it’s sharpness.
Thanks! for sharing such a great post with us. Please keep posting this kind of stuff on your blog.
It is really a great post related to Facebook Timeline Cover Template PSD for Photoshop.
really good covers. i have also faced issue with red colour. the red components of design loose resolution as leo above has pointed out. any insight on that?
The tip to resize to 150% of the original size really helped for me (thank you to the poster who shared that). I’m not sure why but if I upload a 850 x 301 image (also tried 315 for height) it expands the image and goes off the cover image area. Something about the condensing of the images is not working properly.
I’m using 72dpi, upload with a jpg formatted image – sizing is always off from the original image. Not sure Facebook has worked out the kinks?
Thanks for sharing this Facebook cover template!
going on the notion of Facebook (FB) compressing images (probably too much) I even tried to create an image set to 850px (width) x 315px (height) @300dpi. It seemed to improve the quality a little bit:
http://www.facebook.com/SpringingMedia
Comment
Thanks for the template! Love it!
Comment
The timeline covers for community pages have slightly different dimensions from the covers for personal profile pages. This tutorial and every other I can find, doesn’t work for community pages.
I have the same resolution problem. My original Photoshop image is 851×315 at 300 ppi. I saved as a full quality (12) jpg. It is sharp as a tack. Look here to see my cover on Facebook http://www.facebook.com/nelmsphotography .NOT Sharp.
I tried the resize by 150% as mentioned above, no result. I cannot figure out where the problem is happening.
I tried to save for web and devices. No change
Please help!
having the exact same issue. so frustrating!
Try it @ 96 dpi
Hi,
Sorry for my ignorance but how do I save the both images from photoshop ?
Many Thanks!
Same Question. Have you figured it our. I think I need Photoshop for Dummies!:)
Hi guys!
First of all, thanks so much for this template, Neal!
But I have a problem: I want my profile pic and the cover photo to sort of interact, just like in the examples. But I just don’t know how to use this template to achieve that.
Could you maybe create a step by step guide, how to export the profile picture file and the cover photo file from this template, so that they just match when uploaded on facebook? I really can’t figure it out.
Mine is Photoshop themed:
http://www.facebook.com/emanoelmelo
Really helpful, thanks (though the inset image seems to go in a different place for community pages).
Matt
Neal .. thank you so much for the image quality tip .
PSD download link is broken :-
I sure is.
But those are some awesome examples!!!!!
Oh, Eric, this the correct link. The link right above the football image. http://nealcampbell.com/downloads/Facebook-Timeline-Template-Design-Sandbox.psd
I cant download the psd. Please help me.
I clicked on the psd file link but it opened a page saying the page doesnt exist ..
?
i’m looking for a good concept for my page http://www.facebook.com/researchwriters .
any ideas creative people
I have a problem with my cover that is a Photoshopped image. The image is set to 400×100 pixels but only shows half of the image when on the cover. any advice would be appreciated!
And Facebook have just now decided to change the proportions. The profile-pic is now almost twice the size. Any chance of you creating a new template? I found it very useful, but now my page have been a bit messed up..
Hi – My cover pic is repeated as the image for getting to my photos – how can I change this so the photos pic is different. I’ve tried changing the cover pic but it doesn’t work and it is driving me nuts. Can you help?
Looks like we will need a new PSD Template for the cover. FB seems to have changed the size. The pictures don’t align perfectly anymore.
FB keeps on changing! I hate it.
very nice collection and very creative