Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Sep 2008
    Posts
    67
    Thanks
    8
    Thanked 2 Times in 2 Posts

    gradual transition in background image ?

    I'm trying to create a background image that gives the same effect as you get on Pc and mac screens in their natural state: a subtle change of the color from darker at the top to lighter at the bottom of the screen.

    However, when I create a jpeg using photoshop, it always seems to turn into bands of color, rather than a blended transition.

    Any suggestions?

    Does it have to do with the resolution you create the image at?

    Maybe there's a javascript way ??

  • #2
    New Coder
    Join Date
    Feb 2008
    Posts
    64
    Thanks
    3
    Thanked 6 Times in 6 Posts
    Hi,

    Im pretty sure the only way to do this is to add noise then some blur to remove the banding.

    Read more here -> Adobe Forums - Not Achieving Smooth Gradient

  • #3
    Regular Coder meth's Avatar
    Join Date
    Jan 2003
    Posts
    262
    Thanks
    0
    Thanked 9 Times in 9 Posts
    It has to do with your selection of colours to start and end the gradient, and the amount of jpeg compression that you apply.

    When you save the origial image as a jpg, the compression algorithms reduce quality to make the file smaller. That compression leaves bands (compression artifacts). What can also leave bands is the limitation of the number of colours (gamut) that can be used in the gradient.

    You can get a smoother gradient by choosing start and end colours with smaller tonal and hue differences, and saving at higher jpg compression (90-95%) or saving as png 24-bit.
    I do Web Design, Brisbane based.
    More time spent in PHP/MySQL Web Development.
    And Search Engine Optimisation takes up the rest of it.

  • #4
    New to the CF scene
    Join Date
    Jun 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    If you already saved it as a picture such as a jpeg you will not be able to get your layers back. When creating graphics in Photoshop you need to save a PSD and this is your original uncompressed and layered file.
    Last edited by Apostropartheid; 06-25-2010 at 08:19 PM.

  • #5
    New to the CF scene
    Join Date
    Jun 2010
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It's down to your compression.

    Sometimes you can get away with dither, if saving a PNG. When saving a jpg, the higher the compression, the more chance of this problem.

    Chris

  • #6
    Regular Coder
    Join Date
    Aug 2005
    Location
    MS
    Posts
    851
    Thanks
    11
    Thanked 79 Times in 77 Posts
    Maybe try another tool. This is a free online gradient maker. Maybe it will work better.

    Online Gradient Image Maker

    I use Xara to make a better gradient image as it seems to blend better from one color to the next.
    ☠ ☠RON☠ ☠


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •