SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Enthusiast
    Join Date
    Jan 2002
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy Color change when I save gradient image for the web

    I have a large square that has a gradient overlay. The two colors I use for the gradient are web-safe. When I try to save it for the web, the color changes from blue to a purple tone. How can I correct this? I can send the psd file if that would make things clearer. Thanks in advance for the help!

    Chris

  2. #2
    SitePoint Addict
    Join Date
    Jan 2002
    Posts
    245
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    They might be web safe on the extreme sides of the gradient but the middle tones will not be.

    Anyway are you saving the file as a jpg? The colours should be ok if you did that. Also in your photoshop file ensure that you work in RGB mode. Why don't you post up some screen shots.


    Qamar

  3. #3
    Photoshop Ninja jonnya's Avatar
    Join Date
    Jan 2002
    Location
    Birmingham UK
    Posts
    733
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have to correct you on this one... to mintain absolute web safe colours the only way is to save it as a GIF. JPEGs are ALWAYS 24 bit colour (16.4 million colours...a huge amount which are no-where near the 'web-safe' range), where as GIF's are ALWAYS made up of 256 colours or less (made up of the 'web safe' range'.

    I have had similar colour matching problems in the past when using JPEG images, and strongly recomend that you use a GIF... and patern dither the gradient. This will produce a less smooth gradient, but will ensure absolute colour accuracy.

    Also, ensure that if you are using Photoshop 6, you have your colour settings to 'web graphics defaults', this also helps stop colours going out of gammut (out of range).

    Of course, finally, ensure that you are using RGB, or preferably exact hexidicimal defined colours.
    Jonnya Freelance Creative
    UK Freelance designer and web developer
    Website | Portfolio | Photoshop Tips

  4. #4
    SitePoint Member
    Join Date
    Jan 2002
    Location
    The cardboard box under the bridge
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Stupid question: what are web-safe colors? You mean that some colors can't be accurately displayed by browsers?

  5. #5
    SitePoint Addict
    Join Date
    Jan 2002
    Posts
    245
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Jonnya, what I was trying to say was that you cannot do a decent gradient with a gif.

    That is why I mentioned using a jpg.

    Of course if you want accurate websafe colour then use gifs. But nowadays the only reason I would use web safe colours is if I need to match a colour of a image to the background colour of a table for example or to match it against the background of the page.

    Most people now have decent monitors.

    qamar

  6. #6
    Pixels Matter! Jimknee's Avatar
    Join Date
    Jul 2001
    Location
    Island Paradise :D
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by 143_251
    What are web-safe colors?
    http://www.lynda.com/hex.html

  7. #7
    SitePoint Member
    Join Date
    Feb 2002
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    flatten image

    before saving to gif in phot, flatten the layers, in the layers menu ithink...

    I have had problems with many images turning out burnt after saving or other things, such as a color change.

    If that dont work send me the psd and ill make a gif for you and tell you how i did it.

    --yes thre are colors not suitable for the internet audience---

    photoshop and imageready create web safe images from anything you create, you can also reduce the size of your images by taking out the colors you dont need or "see" from afar.

    mail: quantumopum@yahoo.com
    david

  8. #8
    SitePoint Member
    Join Date
    Feb 2002
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    gif gradient texture bevel text dropshadow

    i also have examples
    (if ya care )

    www.verdevalleylocks.com

    tell me what you think of my other site too.....

    www.ineedcameras.com

  9. #9
    Photoshop Ninja jonnya's Avatar
    Join Date
    Jan 2002
    Location
    Birmingham UK
    Posts
    733
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Indeed qamar, indeed, and hopefully no offence taken! The issue seemed to be a colour matching one though, and I thought this was the easiest solution. However, I thought of another one... if you are using Dreamweaver, you can use the eyedropper colour selection tool to sample any colour out of any image, a 'dirty' way of doing it, but another solution if you are not getting accurate colour matching becuase of set-up issues.
    Jonnya Freelance Creative
    UK Freelance designer and web developer
    Website | Portfolio | Photoshop Tips

  10. #10
    SitePoint Enthusiast
    Join Date
    Jan 2002
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thanks!

    Thanks for all the replies. Much appreciated!

    Chris

  11. #11
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by qamar
    Hi Jonnya, what I was trying to say was that you cannot do a decent gradient with a gif.
    Sure you can...I've done it before. It depends though on how long (or wide) the image is to be.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes


Bookmarks

Posting Permissions

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