Color Schemes Contest

Randy | July 28th, 2004 @ 3:22 am

#0cc
#6f3
#63c
#f63

Randy | July 28th, 2004 @ 3:23 am

#fb2
#fea
#09c

Matt | July 28th, 2004 @ 3:24 am

Ah, thanks Randy. For the entry to be valid you have to specify where the colors go. So if you want ot post hex values say #fb2 for header and #fea for background, etc. Just the hex values without context don’t help much. Basically the entry has to be something I can turn CSS, so I need to know what colors go where. Sorry if that wasn’t clear.

Randy | July 28th, 2004 @ 3:26 am

*grumble* brb

Randy | July 28th, 2004 @ 3:28 am

oh, btw, I hereby claim the above colors for use in a “real” entry

Randy | July 28th, 2004 @ 3:30 am

not each color individually (stevarino), those combinations of colors.

Matt | July 28th, 2004 @ 3:33 am

To further clarify, here’s a sample entry:

http://photomatt.net/dropbox/2004/07/sample-entry.png

I just opened the files up in Topstyle and tweaked a tiny bit then took a screenshot. That’s one way to do it. The EditCSS Firefox extension might be a handy way too.

WordPress » | July 28th, 2004 @ 3:34 am

[...] [...]

Jason | July 28th, 2004 @ 3:40 am

I just wanted to poke my head in and say, your sample entry, Matt, is absolutely beautiful.
A very minor tweak, but it looks oh so good.
I nominate it, pay yourself XD.

Stevarino | July 28th, 2004 @ 3:57 am

Hey, just a little something to help everyone out.

http://stevarino.com/wp/color_contest.php?css_file=http://stevarino.com/wp/sample.css

Hack the URI to use your own css file! Good luck!

Stevarino | July 28th, 2004 @ 4:11 am

And randy, I wouldn’t want those colors anyway!

seriocomic | July 28th, 2004 @ 5:43 am

Okidoki…here’s three:

Khaki: Screenshot (40kb GIF) | CSS File

Beach: Screenshot (40kb GIF) | CSS File

Steel Blue: Screenshot (40kb GIF) | CSS File

oooh…pretty…..

Adrian Bengtson | July 28th, 2004 @ 6:08 am

Ok, here’s a try from me, based on my blog color scheme, we can call it “Aetles 1″:
http://adrianb.info/examples/wp-colors/?wpc=1

Tiffany | July 28th, 2004 @ 7:08 am

Here are my entries — I pretty much just took your sample and did some color fills in ImageReady, so please excuse the bad quality.
http://www.maidensoul.net/junk/wpcolors/blue-something.gif
http://www.maidensoul.net/junk/wpcolors/green-wheat.gif

Shadow | July 28th, 2004 @ 7:10 am

Hi there,

Here’s a colour scheme I have been using myself for a little while now.

Maybe others will like it. I find when I am writing posts etc I need to ‘turn the lights down’ so to speak and I find these colours to be less confronting.

Not sure of the best way to show the css so I have placed it here at http://www.os42.com/wp-admin.css so you can grab it and have a look. It’s the one from Mingus 1.2 and has no changes other than colours.

Hope it works.

Mark | July 28th, 2004 @ 7:25 am

Here’s a quick soft blue scheme.

Example File

html file left intact.

Shadow | July 28th, 2004 @ 7:53 am

Hi,

Just realised I am an idiot. It’s much easier if you look at it here now. Sorry about that

http://www.os42.com/adminexample.html#

Lashlar | July 28th, 2004 @ 8:30 am

I don’t know if I should, as I’m not a WP user (and probably won’t be switching from MT any time soon)… but what the heck. Here’s my submission.

http://www.whisperingwords.net/examples/

kartooner | July 28th, 2004 @ 8:48 am

Here’s my entry, of which I deem the Pumpkin theme.

http://www.kartooner.com/wordpress13style/

Hanni | July 28th, 2004 @ 9:16 am

*Shudders* I’m sorry, it’s pink.
http://www.pinksocks.co.uk/projects/wordpress/1.3-example.html

Larrisa | July 28th, 2004 @ 9:19 am

I like the grayscale look of the interface to tell you the truth. If you do plan to change the style for the admin interface please do keep an option to roll-back to the grayscale scheme One thing I would like to see changed is the default WP template. Its dull and unattractive.

BTW, just looking at the users admin page (for 1.3), can u please change those user level +/- links to a dropdown list. Its more usable!

Erik Drabløs | July 28th, 2004 @ 9:22 am

Matt’s Handsome Orange Sandbox

Sushubh | July 28th, 2004 @ 9:48 am

Don’t tell me, you are going to promote Firefox through WP now! Its not fair for Opera lovers like me.

wordlog.com » Admin Color Contest | July 28th, 2004 @ 10:19 am

[...] [...]

Chris J. Davis | July 28th, 2004 @ 11:01 am

Ooh, Ooh, try this one on for size: http://stevarino.com/wp/color_contest.php?css_file=http://www.chrisjdavis.org/wp-admin.css

Adrian Bengtson | July 28th, 2004 @ 11:55 am

Here’s another one. “Aetles 2″:
http://adrianb.info/examples/wp-colors/?wpc=2

It’s a slight variation of Aetles 1 posted earlier. I’ve tried to pay attention to all the :hover and :focus colors as well.

All Day Permanent Red » WP admin color contest | July 28th, 2004 @ 12:19 pm

[...] Tired of the grey? Photo Mat is having a contest. There are already some interesting entires where, with source CSS. [...]

Matt | July 28th, 2004 @ 12:22 pm

Places to look for color inspiration:

1. Fashion
2. Great photographs
3. Outside
4. At websites you admire
5. Paintings
6. Magazines — everything from Wired to Home & Garden
7. Flowers
8. Skin tones
9. Butterflies
10. Book covers

Ryan Schwartz | July 28th, 2004 @ 12:34 pm

Here’s one inspired by my site, of all things. I like that color, hope you do too.

dan | July 28th, 2004 @ 12:50 pm

I realize this isn’t about the layout, but since you’re discussing the admin page I thought I’d ask. One of the reasons I’m still waiting to switch to WordPress is that in Opera the elements are stacked on top of one another. Is anyone working on a fix for that? Or better yet, does someone know how to fix that? I’ve tried and failed miserably.

Matt | July 28th, 2004 @ 12:59 pm

For fun I put together another example:

http://photomatt.net/dropbox/2004/07/sample-entry-2.png

Happy Steve | July 28th, 2004 @ 1:05 pm

Whee… just for gits and shiggles, I added a “color switcher” to various parts of the page. Now you can mix and match a whole array of colors just by clicking on any of the colored X’s to change the background color of the div it’s in. Click on the O at the end to make it transparent. (I wrote this javascript to help my company’s marketing department choose the colors they like)

http://yankovic.org/happy/photomatt/

Erik Drabløs | July 28th, 2004 @ 2:41 pm

Just a couple of questions:

How strict are you on the “no layout changes”? I’m asking because the images in the footer just don’t look good on dark backgrounds.

And what should we do with colors for pages we can’t see in the dummy page? Should we just leave them alone and then fix them later if our entries are selected?

Jina | July 28th, 2004 @ 2:52 pm

I have created two color schemes:

• Sterile
• Caramel

Okay, okay. So I simplified the CSS as well. I couldn’t help myself. I like clean and simple.

Jina | July 28th, 2004 @ 2:52 pm

• Sterile
• Caramel

Sorry about that!

David Yeiser | July 28th, 2004 @ 3:32 pm

Mono Blue
Green-Maroon

Matt Warren | July 28th, 2004 @ 3:32 pm

The first of several to come, here’s a brown-cream type theme: http://www.merseine.com/wp/cremebrulee.html

Enjoy!

Thomas | July 28th, 2004 @ 3:37 pm

I have not had any idea about the name, so.. let me call it “Hurry up” :D. You can see it here. Thank you!

Jesus Vargas | July 28th, 2004 @ 3:46 pm

I prefer it b/w… much more serious.
Congrats for the winner. *cheers*

Matt Warren | July 28th, 2004 @ 3:56 pm

…and here’s my second flavor. A la photomatt: http://www.merseine.com/wp/photomatt.html

Again, have fun and enjoy!

Carthik | July 28th, 2004 @ 6:26 pm

Shall I call it Colorless before you call it Ugly?

journal » Wordpress Admin Contest » jinabolton | July 28th, 2004 @ 7:12 pm

[...] [...]

Randy | July 28th, 2004 @ 7:16 pm

Here we go:

http://randywalker.net/library/graphics/wp-1.jpg

(of course, I didn’t edit the header shadow… )

Matt | July 28th, 2004 @ 7:23 pm

If the images look funny (don’t anti-alias well) that won’t be held against anyone in judging.

Randy | July 28th, 2004 @ 7:26 pm

Yea… Paint did that automatically… :\

musicandmeaning | July 28th, 2004 @ 7:29 pm

Inspiration by osmosis? After I finished the first color combo, I looked at photomatt.net again and realised…hey, what a sec…

+ Warm sandbox (white)
+ Warm sandbox (gray)
+ Cool sandbox

blink | July 28th, 2004 @ 7:39 pm

I couldn’t think of a witty title. It’s definitely inspired by my emotional state over the Ricky Williams retirement fiasco though.

blink | July 28th, 2004 @ 7:39 pm

I also could think to remember the link: http://www.iamjackscompany.com/blink/wordpress/index.html

Matt Burris | July 28th, 2004 @ 8:28 pm

Here’s my hack at it, dubbed Summer Days: http://goodblimey.com/redesigns/1.3-example.html

Greg | July 28th, 2004 @ 9:49 pm

Here is my first, and probably last, entry: http://stuffandthings.org/1.3-example.html. I did change one or two padding values, but the idea is to give you a clear picture of the color scheme I like.

I will write more about the color changes later.

musicandmeaning | July 28th, 2004 @ 9:52 pm

A couple of more:
+ Sandbox-by-the-Sea (cool)
+ Sandbox-by-the-Sea (warm)

Greg | July 28th, 2004 @ 9:53 pm

I take that back. All original paddings and margin’s have been restored. The entry is still at the same place: http://stuffandthings.org/1.3-example.html.

seriocomic | July 29th, 2004 @ 1:55 am

Re Comment#41 - from Matt Warren…

How do we compete? We all know Matt (Mr Mullenweg) is partial to his first name, so to have someone with the same first name submit a layout mimicing his (Mullenweg’s) own site…

Classic…lol

Lane | July 29th, 2004 @ 3:51 am

IMO, I really think simplifying things is the main key here. I would also match up the representing colors of the WP logo with the interface to tie in the relation (yet keep the majority pretty neutral so there can be an easy color change like in the header to reflect what the person likes). Lets face it, there will be endless color possibilities and everyone will like something or another since everyone’s tastes are different (search color theory). So, I think the WP logo colors/branding would be the most important just for “brand” identity.

Here’s what I did:
Example1 (blue)
Example2 (brown)
My concentration was on keeping the main parts neutral, cleaning up the page visually (removed unneeded block elements, increased things like “Title” and “Post” to help focus them, etc), and allowed “white space” for a clean design.

seriocomic | July 29th, 2004 @ 3:53 am

Ok, I spent a few more seconds on this one…

Bevelled

akmal | July 29th, 2004 @ 6:02 am

here’s my entry:
Slate

pretty simple imo. it can’t beat that “bevelled” version from seriocomic though -_-*

Michael | July 29th, 2004 @ 8:54 am

header bg: #71828C
the links bar going sideways underneath the header: #E9E4E4
hover for a link: #CAE1F6
post section bg: #CEDAE1
content bg: #fff

jason stanfill | July 29th, 2004 @ 9:10 am

Here is an entry, same basic colors just darker for a little more impact.
http://www.jasonstanfill.com/wp-darker.html

Thaleia | July 29th, 2004 @ 9:15 am

Here’s something I tried:

Camel

Jason McIntosh | July 29th, 2004 @ 9:25 am

I made this style, similar to the style my blog uses:
http://poetshome.com/sample_admin_wp.html
and for a bigger change:
http://poetshome.com/sample_admin_wp2.html
The second page I wanted to have the .current class to have a white border, but I didn’t have time to figure out the css to override the border setting for the parent adminmenu tag.
And yes, it’s dark But, sometimes that’s easier to see.

Cheah Chu Yeow | July 29th, 2004 @ 12:18 pm

I’m not sure if anyone has posted a similar scheme before (didn’t want to look at too many other pieces of work).

Here are 2 submissions:
something maroonish-blue
something greenish orange

Louis C. | July 29th, 2004 @ 12:30 pm

Dark Admin <– there’s my attempt at an admin color scheme

Jina | July 29th, 2004 @ 12:40 pm

Aye, I just noticed the “no changes to the layout” rule. *slaps forehead* Just curious, Matt, do I qualify? I know you said not to change the layout, but I only changed the css, no changes to the xhtml was made. Either way, I still had fun doing it.

Alec | July 29th, 2004 @ 3:00 pm

Blue is good.

If you like yours a little monochromatic.

Mono and dark.

I wish I could do this all day instead of working.

the absent student | July 29th, 2004 @ 7:22 pm

sepia & tulip.

Matt Warren | July 29th, 2004 @ 9:33 pm

This is a pretty heavy modification, but I like it. I changed some things other than just color values, but the only tomfoolery was with the CSS, which is still basically the same. The layout, or at least the XHTML portion of it, is still intact.

Matt’s Sharp Sandbox

(It looks much better in a Mozilla client. Sorry, I couldn’t resist using the border radii. It still looks good in other clients, though.)

seriocomic | July 30th, 2004 @ 12:16 am

Ok, last one, based on the previous beveled entry, this time with a gorgeous color scheme i’m sure has been seen before

It’s called SerioIndex…

Ali_ix | July 30th, 2004 @ 1:56 am

Hey Matt try SEPIA color scheme looks good

Lita | July 30th, 2004 @ 2:15 am

Ah, crud. I’m too late. I should have checked back here earlier. I would have had fun with this contest!

Matt | July 30th, 2004 @ 2:19 am

You’re not too late, it’s going on until tomorrow night.

chris | July 30th, 2004 @ 9:29 am

Okay, I present you:

Raspberry Milk serif and sans-serif
Biarriz in the autumn serif and sans-serif

chrisW

Joerg | July 30th, 2004 @ 9:33 am

Hallo Matt, I hope, you take a look at this page. Here is my wordpress-style:

I called it “Wordpress da Vinci”.

Wish you the best. Have fun!
Joerg

Dextro | July 30th, 2004 @ 10:10 am

So, here is my idea: Dextrose - Contest Scheme

Quick done, so only working in Firefox, not in Opera or IE.

Mark | July 30th, 2004 @ 11:52 am

Second entry, just for kicks.
Link

chris | July 30th, 2004 @ 12:08 pm

Ohhh, this is educational! I really liked Matt Warren’s rounded edges, but prefer my colours. Never heard of -moz-border-radius before. So this can’t count because I cheated and looked at Matt’s entry first. Still, here is Raspberry Milkshake.

chris | July 30th, 2004 @ 12:12 pm

Forgot to say: Raspberry Milkshake is only palatable in Mozilla et al. (otherwise indistinguishable from plain old Raspberry Milk). Second, maybe it’s not a bad idea to give non-IE users a little extra, without penalising IE users. Maybe there’s a little Opera-specific CSS special, too?

kartooner | July 30th, 2004 @ 12:13 pm

I have another entry, based again on “Pumpkin”, but this time I modified some of the graphics and cleaned up the UI to my liking — I’m currently using this exact them in my backend (here’s a screenshot);

Pumpkin Wordpress Theme

the absent student | July 30th, 2004 @ 12:30 pm

As several people seem to want to modify more than the colours, are there any plans for a full-scale CSS competition? In the meantime: orchid.

Heather Anne | July 30th, 2004 @ 12:59 pm

Here is my entry.

http://heatheranne.org/images/prpl.jpg

Heather Anne | July 30th, 2004 @ 1:12 pm

I forgot to change the text color and the color in the buttons, so here it is again, modified.

http://heatheranne.org/images/prpl2.jpg

jason stanfill | July 30th, 2004 @ 2:24 pm

Well in honor of Lance Armstrong’s 6th consecutive victory and his Wear Yellow campaign I have created two more.
Wear Yellow 1
Wear Yellow 2

This has been fun, thanks Matt

jason stanfill | July 30th, 2004 @ 2:26 pm

Those last links didn’t work, forget a double quote so here they are again
Wear Yellow 1 [http://www.jasonstanfill.com/wp-wearyellow.html]
Wear Yellow 2 [http://www.jasonstanfill.com/wp-wearyellow2.html]

Jennifer Grucza | July 30th, 2004 @ 2:33 pm

I really like Alec’s and Mark’s entries.

I hope I have time before the contest is over to do my own. Unfortunately, I’m at work right now or I’d do one now.

Jina | July 30th, 2004 @ 2:56 pm

Hmmm, I didn’t get an answer, so I guess the answer is no? *grin*

Oh well. I’d still like to offer my CSS up to anyone that wants to use it. (That was all I altered, no changes to XHTML were made.)

Konstantinos | July 30th, 2004 @ 4:03 pm

Here’s my entry: Middle Earth

I’ve done some font-tinkering too, but you can ignore these changes if you wish.

(PS: How many hours till the contest is closed?)

Heather Anne | July 30th, 2004 @ 4:16 pm

Here is another

http://heatheranne.org/blogstuff/black1.jpg

http://heatheranne.org/blogstuff/black2.jpg

Heather Anne | July 30th, 2004 @ 4:17 pm

And one more

http://heatheranne.org/blogstuff/blue1.jpg

http://heatheranne.org/blogstuff/blue2.jpg

Heather Anne | July 30th, 2004 @ 4:19 pm

And here is the final revision of the purple one

http://heatheranne.org/blogstuff/purple1.jpg

http://heatheranne.org/blogstuff/purple2.jpg

Adrian Bengtson | July 30th, 2004 @ 5:01 pm

My third and last, a somewhat coffee-like theme, “Aetles Coffee”:
http://adrianb.info/examples/wp-colors/?wpc=3

Jennifer Grucza | July 30th, 2004 @ 5:02 pm

Here’s my entry (thanks to Stevarino for the stylesheet switcher): inspired by a photo of the Boston skyline.

It’s a little rough around the edges, but it gets the point across. I particularly wanted to make the buttons different colors from the input boxes, so it’s quite obvious that they’re not the same.

Konstantinos | July 30th, 2004 @ 6:19 pm

Just to be on the safe side, Middle Earth, Stripped Down is pretty much like Middle Earth, without the font-tinkering and the tiny & few margin/padding additions.

Erik Volkman | July 30th, 2004 @ 9:45 pm

Here’s a green color scheme that I came up with.

green theme

Matt | July 31st, 2004 @ 1:30 am

Okay, you can still submit schemes if you want to but after this comment they won’t be able to qualify for a prize. Thanks to everyone who entered! I’ll be judging over the weekend.

CarLBanks | August 3rd, 2004 @ 8:45 pm

When do they become a plugin?

Erik Volkman | August 3rd, 2004 @ 11:53 pm

How’s the judging going?

Matt | August 4th, 2004 @ 12:03 am

Slowly, I’ll finish it up this week though. I want to give every entry a fair shake.

CarLBanks | August 4th, 2004 @ 9:01 pm

Ahh okay, since I badly want to replace the dull WP admin interface.

Erik Drabløs | August 6th, 2004 @ 5:07 pm

Well, you don’t have to wait for the plugin to use the .css files. It will just be easier then. All you have to do is to replace wp-admin.css with the css-file of your choice.

Dextro | August 11th, 2004 @ 6:06 pm

Slowly, I’ll finish it up this week though. I want to give every entry a fair shake.

Strange week Matt

Shadow | August 19th, 2004 @ 7:37 am

Sorry, I must have missed the results. Where do you find the winning schemes?

Alec | August 27th, 2004 @ 12:43 pm

[/wondering-whatever-happened]me[/wondering-whatever-happened]

CarLBanks | September 25th, 2004 @ 9:57 pm

Is the contest still going on?

john | October 6th, 2004 @ 3:35 pm

You might find Color SynthAxis handy for brainstorming color swatches. Read the tutorial linked at the top of the page.

Danny Dawson | November 22nd, 2004 @ 4:56 pm

Matt, what is the “Dashboard” link for? Is this some new feature I’m not aware of?