Skip navigation
Currently Being Moderated

Beginner Question, how to create this background??

Apr 20, 2012 2:54 AM

Tags: #photoshop #cs5

I am a beginner of PS, how can I create the background similar to the following backgrounds for iPhone?

I don't mean the logo, just the background, what techniques are used to create a background like them?



Photo Apr 20, 5 29 52 PM.png

Photo Apr 20, 5 33 12 PM.png

  • Trevor Dennis
    5,943 posts
    May 24, 2010
    Currently Being Moderated
    Apr 20, 2012 4:44 AM   in reply to RNMGG

    They are done using the gadient tool (behind the Paint bucket.  Make your foreground colour the darker tone, and background colour the lighter tone.  Then select the gradient tool and in the Options bar it needs to be set to Background to foreground.  A little further along the Options bar you'll see a few styles.  The first one is linear, which will produce the first of your examples.  The next option is radial, which will produce the Facebook style example.

    Mark as:
  • Currently Being Moderated
    Apr 20, 2012 3:35 PM   in reply to RNMGG

    Another way as an example for the first one is to use a gradient overlay fill layer (from the adjustment layers icon at the bottom of the layers panel)

    You can move the gradient while the gradient overlay dialog is open by dragging on the screen.


    Not sure what the particulars are for an iphone graphic.




    Mark as:
  • Trevor Dennis
    5,943 posts
    May 24, 2010
    Currently Being Moderated
    Apr 20, 2012 4:13 PM   in reply to R_Kelly

    A very quick Google showed the iPhone to be 960 x 640 and sRGB.


    If you are not getting a smooth gradient, then possible reasons are


    You have a very low res image file that you are expanding to fit the screen.

    Your background and forground colours are nearly identical which is resulting in Banding.  Changing to 16 bit image mode would probably fix that.

    You are in Indexed colour mode with a low bit depth.

    You are saving as minimum quality JPG or GIF


    If you start with the above 960 x 640 sRGB image, and use one of the gradient options suggested, you should get a perfectly smooth result.

    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points