WordPress.com

1. andiandjack
   Member
   Sep 2, 2012, 2:48 AM

   Today I purchased the Custom Design add-on and began changing the colors of my WordPress.com blog at http://andiandjack.wordpress.com. I am using the Balloons theme. The interface seems to be working perfectly, but the color values selected from the color wheel do not match what is displayed in the preview window or what is displayed publicly once the changes are saved. Specifically, the colors are much darker and more subdued than the colors selected from the wheel (or entered manually as hex values).

   I have since reverted to the default color values, and even now the colors are significantly darker than the default should be. Does anyone have any ideas what's causing this problem or how to resolve it?

   The blog I need help with is andiandjack.wordpress.com.

2. designsimply
   Staff
   Sep 5, 2012, 7:37 PM

   I checked http://andiandjack.wordpress.com/ just now and the colors don't look too dark to me. I also made sure to check the customize view which shows the color palette as well as the color picker on the left under the "Colors & Backgrounds" heading, and any color changes I test appear to match up with the previews show on the right. I tested in two different browsers: Firefox and Chrome.

   Are you still experiencing the same problem if you check it again now?

   If you're still having trouble, do you think it would be possible to post a screenshot of the problem showing the entire browser window so we can see what you are seeing?
   http://en.support.wordpress.com/make-a-screenshot/

3. andiandjack
   Member
   Sep 5, 2012, 10:40 PM

   Thanks for responding. Yes, the problem persists on my end. Here's a screenshot of the "Colors & Backgrounds" interface on my end, with a sample hex value selected.

   Here is the screenshot.

   As you can see, the palette and color picker in the left margin displays (correctly) a bright, vibrant yellow. The header text in the preview, however, shows a much more subdued, murky hue. This is the same problem I'm having with pretty much any color value. To demonstrate, I've saved and published the page with the hex value used in the screenshot. The public-facing page is now displaying the same murky hue as shown in the screenshot.

4. designsimply
   Staff
   Sep 21, 2012, 4:41 PM

   Apologies for the delayed reply.

   Ah, I see now! Thanks so much for the screenshot.

   The color picker has some contrast rules built in to try to make sure text is always clear and readable. It will auto-adjust text color contrast if it finds that you select a color that is very close to the background color. The contrast rules are put into place to help with accessibility (i.e. to help the visually impaired) and readability.

   You can work around those accessibility rules by adding more explicit rules in your CSS editor directly, like this:

   .site-title a {
   color: #f5f34d;
   }

   But I would recommend at least keeping an eye on what the color picker tools suggests for accessibility reasons.

Topic Closed

This topic has been closed to new replies.