Adobe Community: Color matching

Currently Being Moderated

1. J Cellini,

Sep 2, 2010 2:15 PM in reply to sam1223

Report

Sure. Just use the same color values in both applications.

|

Mark as:

Currently Being Moderated

2. sam1223,

Sep 2, 2010 2:33 PM in reply to J Cellini

Report

I sampled grey in PS and filled background with same color code in DW. The greys appear different in DW, creating an edge when viewed in "live view." Will this edge go away in the browser?

|

Mark as:

Currently Being Moderated

3. MurraySummers,

Sep 2, 2010 3:06 PM in reply to sam1223

Report

Beginner's question: Can a background color in a photoshop image perfectly match a background color specified in Dreamweaver?

Probably not. HTML colors are 256 color palettes. Photoshop images can be millions of colors. If you have to match one with the other, slice a small snippet from the PS image, and use that as a tiling background image rather than trying to use HTML colors.

|

Mark as:

Currently Being Moderated

4. John Waller,

Sep 2, 2010 3:15 PM in reply to sam1223

Report

Can you give us a link to an example of what you're working with?

|

Mark as:

Currently Being Moderated

5. sam1223,

Sep 2, 2010 3:46 PM in reply to MurraySummers

Report

Thank you. Thought of tiling a background, wondered if it was too complicated. Would it create issues in the page appearance on various browsers? Is this the common fix? Seems like this must be a common problem (dropping in a complicated shape into a web page color background)

I used "web safe" colors for in both programs, still get an edge between PS image and DW backgrd.

|

Mark as:

Currently Being Moderated

6. sam1223,

Sep 2, 2010 3:48 PM in reply to John Waller

Report

No link yet and not quickly done, but thank you

|

Mark as:

Currently Being Moderated

7. MurraySummers,

Sep 2, 2010 3:52 PM in reply to sam1223

Report

Thought of tiling a background, wondered if it was too complicated. Would it create issues in the page appearance on various browsers?

No.

Is this the common fix?

Yes.

I used "web safe" colors for in both programs, still get an edge between PS image and DW backgrd.

In that case, something else is going on, since web safe means a 256 color palette. Does your PS image have texture in it by chance?

|

Mark as:

Currently Being Moderated

8. sam1223,

Sep 2, 2010 4:36 PM in reply to MurraySummers

Report

Nope. No texture. Both PS grey and DW grey are #333333, but DW grey appears at least 10% lighter.

Tiling works, thanks.

|

Mark as:

Currently Being Moderated

9. bemdesign,

Sep 3, 2010 5:43 AM in reply to sam1223

Report

If you use Photoshop's Save for Web feature, be aware that, unless otherwise unchecked, it will embed an sRGB color profile into your web graphics. Some browsers support color profiles and others don't. This can be problematic and cause color shifts (between html hex color code versus a Photoshop-created JPEG). For general web image work, I'd suggest unchecking that sRGB color profile box.

|

Mark as:

Currently Being Moderated

10. sam1223,

Sep 3, 2010 2:06 PM in reply to bemdesign

Report

Thank you! I re-saved jpg without color profile and the greys match.

I love this forum. Solved problem and I learned a lot.

|

Mark as:

Currently Being Moderated

11. A.P.Design,

Jan 16, 2011 8:01 AM in reply to sam1223

Report

Hey, I'm having the same problem, except I'm using a background image created in photoshop tiled vertically and can't get the color it contains to match with that of a .jpg image I have overlayed on top of it. They both use the same hex code color but do not show up looking the same in dreamweaver. Shouldn't hex codes be universal and always match themselves? Could this be a compression issue with the background image? I've exported the .jpg at maximum quality but the background image is a .png, could that be the issue?

Heres a link to the site: http://alecpage.com/in_progress/LvilleLax/index.html

Notice the red shift below the banner... any ideas?

|

Mark as:

Currently Being Moderated

12. garywpaul,

Jan 16, 2011 8:26 AM in reply to A.P.Design

Report

Frankly I'm a little confused. The page you gave the link to does not have a DTD, no html tags, no head tags. It appears your using html5 as well....

What am I missing here?

Gary

|

Mark as:

Currently Being Moderated

13. MurraySummers,

Jan 16, 2011 8:39 AM in reply to A.P.Design

Report

The code on your page is invalid. An HTML page cannot begin with a <title> tag....

You have taken some creative license with your background style syntax -

body {

background-image: url(elements/images/Background_4.png) , url(elements/images/Tile_Left.png) , url(elements/images/Tile_Right.png);

background-repeat: repeat-y, repeat-y, repeat-y;

background-attachment:fixed, fixed, fixed;

background-position:top center, left, right;

}

|

Mark as:

Currently Being Moderated

14. A.P.Design,

Jan 16, 2011 8:49 AM in reply to MurraySummers

Report

As is probably evident, I have very little html experience. I tend to work

purely visually and this is a first foray into web design as opposed to the

graphic design I usually do. Thanks for pointing out the spots where I need

to spend some time with the html. As far as the visual issue of color

matching, any ideas where the issue could lie?

|

Mark as:

Currently Being Moderated

15. MurraySummers,

Jan 16, 2011 10:23 AM in reply to A.P.Design

Report

Ugh - all of my post didn't post! Here's the missing part -

An element can only have a single background image, so that style doesn't accommodate multiple image specifications. The only background image that will be used is the first one (Background_4.png).

The color above the menu is #801B0F (http://alecpage.com/in_progress/LvilleLax/elements/images/menu/Top.jpg) and that below the banner (but still part of the banner image - http://alecpage.com/in_progress/LvilleLax/elements/images/menu/Banner. jpg) is #8C1114. Meanwhile the body background image (http://alecpage.com/in_progress/LvilleLax/elements/images/Background_4 .png) is #8C1115. Get all of those colors the same, and they will look the same on the page. A part of your problem could be that you are trying to match PNG (256 color palette) color to JPG color (millions of colors palette). It's much easier to match JPG to JPG, or PNG to PNG.

|

Mark as:

Currently Being Moderated

16. A.P.Design,

Jan 16, 2011 11:46 AM in reply to MurraySummers

Report

Thanks, that helps a lot. As far as the html goes, I'll get to work on the basics.

Thanks for the help.

|

Mark as:

Currently Being Moderated

17. brankoprepunic,

Dreamweaver CC

Color matching

Sep 2, 2010 2:07 PM

More Like This

Bookmarked By (0)

Answers + Points = Status