Which color combination to use on websites? - web

Just interested in knowing if there are any good (and short! :-) ) articles which talk about the color combinations that would look good on a website.
i.e For tables (odd and even row), which one will be good in all situations
For alerts? For menus? etc
Thanks!

When it comes to colors, I don't think there are any set colors like you ask. There are no articles that say "ALL MENUS MUST BE BLUE!".
For alerts, either a light or golden yellow is used (so that you don't burn your eyes out), or a dark maroon or peachy pink for more prominent alerts. Menus can be any color, but they should match your color scheme.
I think what you are implicitly asking for are color schemes. Take a look at these resources:
Prefab color pallets for inspiration
Color scheme helper chooser
Aviary (Toucan) color chooser (flash)
Visibone color lab
Related articles
How color schemes work
How to choose a color scheme
How to select color combinations
In addition, if you are serious about your website, I strongly STRONGLY suggest reading this book:
Steve Krugs Dont Make Me Think
The book is in an easy to read (and skim) format, and is about colors, interfaces, buttons, and designing the easy-to-use website with lots of pictures and examples. For me, it was a quick read ( < 1 hr), and it changed my life.

simple advise : do not use many colors. select three or max four different color. and work with their shades.
for color scheme selections nothing beats...
http://kuler.adobe.com/

Related

Changing colors in a simple shape editior

I've made a simple shape editor. I can change colors (used to fill shapes) by click on buttons in a menu bar. The disadvangate of this solving is the fact that the numbers of colors are so restricted. I can't find a better solution for my program. Can somebody help me and give me an idea how can I improve it? I thought about color palette, but I have no idea how can I do this.
The image:
("Aktywny kolor" means active colors, and there is the list of colors below, which I can use)
You would need to use a color picker where the colors are distributed on many pixels and not on a very small set of color names. Since you are using applet, you might want to download an already made color picker compatible with your environment, or you might want to write your own, depending on whether the things you find meet your expectations.

Creating an image whith GIMP hiding another image unless we add a color filter in real life

The idea is like the inverse of Ishihara test (http://www.colour-blindness.com/colour-blindness-tests/ishihara-colour-test-plates/).
I want to create with GIMP an image that showing something and then if I add a color layer, for exemple green glasses, then I see something new appearing.
I've searching far in Google and so but didn't found anything. Do you know how would I make this?
The Ishihara tests use the principle of combining things color blind persons cannot differentiate.
Coloured glass filters will only remove other colours from what you see. They don't add something. Therefor it is not possible to create a digital image that contains no information unless seen through a colour filter.
The only thing you can do is overlap your "hidden" information with high contrast colour noise.
Like here:
Using the glasses / filter only improves the visibility. The information is not added. It was always there.

How to get matching colors (red and green) for a given color code (blue)

I am new to CSS and programming in general so I am sorry if this is a beginner question but I couldn't find a proper solution myself.
If I have a certain color code (HEX), e.g. #028dca, how can I get matching colors for this ?
I found a number of tools online but I only saw solutions that give me different shades of the same color whereas I need different colors that match the above hue etc., especially red and green - and a few more colors would be nice to have.
One of several examples I tested is the following but again I couldn't find a proper red and green tone there, just different shades of blue and orange as the complementary color (and it looked similar with other tools I checked): https://color.adobe.com
Can someone help me with this ?
Many thanks in advance,
Mike
Don't know actually what you mean with "couldn't find a proper red and green tone". Given a particular color, it has complementary colors... it's math.
Here is the one that I use: http://croma.numixproject.org
Try using Coolors.co
You can fix on colors and then try different palettes.
The one with the color you posted would be like this - http://coolors.co/app/86615c-f1a699-028dca-79065a-02241a.
You can explore more by hitting the spacebar

Does anyone know a light Vim scheme which makes coding more readable and pleasant?

I know a lot of nice dark schemes for Vim which makes coding more readable and pleasant such as ir_black, wombat, zenburn. Its weird but I haven't seen so many popular light themes (white background).
Does anyone knows a light Vim scheme which makes code more readable and pleasant to see?
(that makes code less confusing to distinguish, something like Visual studio's default scheme?)
With all due bias-based disclaimers and caveats (I am the author of the color scheme), I find that Mayan Smoke both highly ergonomic as well as aesthetically pleasing (screenshot). Download page: http://www.vim.org/scripts/script.php?script_id=3065.
As alternative, you should also have a look at the immensely popular Pyte, which is eerily similar to Mayan Smoke (development was independent, and the similarity is convergence, I swear!), though the syntax colors are a lot more muted.
Check out http://vimcolorschemetest.googlecode.com/svn/html/index-c.html, it has a HUGE list of colorschemes with previews.
If you do not like C samples, there are samples with other programming languages, too: http://code.google.com/p/vimcolorschemetest/
Louver is a bare-bones, light color scheme that somewhat resembles the default Visual Studio look.
Screenshot:
http://jstap.web.fc2.com/louver.html
I like Solarized for LCD monitors. It sucks on CRTs.
http://www.vim.org/scripts/script.php?script_id=3520
Screenshots at http://ethanschoonover.com/solarized
This new theme is really nice, even with GVim on Windows:
https://github.com/reedes/vim-colors-pencil
I like dark background, but changing software a lot which like IE, VS studio .... So changing from dark to light and back is so uncomfortable, so light background is also my choice, I more prefer the theme name ironman, you can find it on vim plugin page.
You should try eclipse theme.
https://github.com/vim-scripts/eclipse.vim
Interesting subject and such contradictory statements. First: according to my experience, everything with dark background is very bad for my eyes, unless I work in total darkness. But you shouldn't work in darkness anyway, just turn the lamp on.
Second: for (my) eyes feels best the backround color which I would describe "light neutral gray with slight greenish tone". BUT: especially these colors are very different from one monitor to another (with same RGB value), for example these are "guibg" colors from my two computers' schemes: guibg = #E2E2D8 on one pc and guibg = #E6EDD8 on another. Despite the colors look very similar they have different values. So honestly, there is only one way to make it "good for your eyes" - just pick some good scheme and finetune the colors, especially this background color is important imho. Also you can set several schemes with bg color adopted to outer lighting conditions. So if you see a description like "this color scheme is very good for eyes", it's sort of bulls*it, since it really depends. But I'd certainly advise to avoid any dark schemes.
As for me, readability is high and uniform contrast of all syntax elements.
https://github.com/andbar-ru/vim-unicon

practically most used background colors in web design

I'm customizing a color picker's default showing colors which will be used as background colors. I'm wondering if there is a collection of the colors that are particularly useful in practical web design. Like nobody(hopefully) would use #f00 as a 100%-width page's background color while #fff is a universally usable one, there's DO'S and DONT's when it comes to picking background colors. So what are the candidates in your opinion?
I know this could be subjective, but generally I believe there IS a solid set of them.
[edit] : I kinda have an idea to customize the color picker in a logic way, first pick a buch of hues, them for each hue, start from the possible lightest of saturation to the possible heaviest. A bit demenstration:
gray [ #eee, #ccc, #ddd, .... ]
green [ ... .... ... .... ]
blue ....
yellow
brown [
As for a realistic answer, #fff won the race, right? Sometimes you'll see shades of gray, #eee, #eaeaea, and an occ. #000.
If you want to mix things up, I'd recommend checking out http://kuler.adobe.com/ to get an idea for what's popular, but perhaps slightly different. It's fun to experiment with the palettes up there.
I don't think there is a universal standard for picking up colors for your site. It entirely depends on the nature of the site and the kind of users that visit the site.
For eg: it would be nice to give a greenish color for a site that's theme is nature.
Here is a nice site in which you can choose color combinations and get a preview of that in a single click.
Color Scheme Designer
Never choose a color that will distract the user from seeing the actual contents of the site.
If you allow users to select the color then it would be nice to show them a preview of the site with the colors they have chosen.
Contrast is what really matters when choosing background/foreground colours, so they're likely to be very light, or very dark
so you'll need light and dark variants. i'd probably opt for:
light red, orange, yellow, green, blue, indigo, violet
and dark as above
maybe the same for some earthy type tones, browns, greys, etc.
If you like colours like I do, you might visit ColourLovers. They've got some great ways of choosing colours, and colour schemes. The website trends section might be interesting to you.
I personally like schemes where the lighter colour is not pure white. Pure white can be sometimes harsh when reading lots of text.
Creativity is BREAKING the rules.
It is possible that a seemingly bad color combination, if used in right proportions, can actually look good, so there is no such thing as a bad color combination, it also matters on the shades, difference in colors.
Believe it or not, i own a site (www.salvin.in) where user can change the background color to many different choices and it still manages to look good *ahem in most of the cases.
There are a few things that i suggest you to look into:
Color wheel
Color harmonies
Triads and Tetras
Mono chromes (with contrasting shades)
Complimentaries
I find that #000 messes up my eyes. After looking at mainly #FFF pages/applications, then switch to #000, then when I go back to anything else, it take a while for my eyes to adjust. I vote "no" to #000.

Resources