W.I.P. Need Your Opinions on Colour Choice

[Toni]

Hi i would really appreciate your opinions on what colour would suit our website best.
Please have a look at our Meditation Section
this is the basic layout we would like on all our sections but before ordering a logo and banner i would like to have done my final decision of the colours to use mainly for the 2 sidebars and sign-in box.
Also if you see any other improvements that need to be done please let me know.

Thank you for your help.
Toni

 

[cappa1_2000]

The greens are a little harsh for a 'meditation' website.
How about some of these combinations:

 

[gaucho1976]

you may try something like this, I also did a quick cleaning and added some space to your layout, simply copy and paste the following code in sd.css and get rid of the embedded styles (make a backup just in case)

Either if you use it or not, try to clean your css or you'll go nuts, esp when you have css styles declared twice in different style sheets (so you'll wonder why when you change something it may not reflect in the design)

BODY {



	margin: 0px;



	padding: 0px;

	background-color:#F3F9F1;





}



#main {

	position:absolute;

	left:0px;

	top:0px;

	width:100%;

	height:100%;

	z-index:0;

}



#background {

	position: relative;

	width:1000px;

	background: #fff  repeat-y;

	z-index:0;

}



#inhalt {


margin:auto auto;
	top:0px;

	width:960px;

	height:100%;

	z-index:1;

}





#logo {
	position: absolute;
	left: 3px;
	top: 0px;
	width: 900px;
	height: 131px;
	background-color: #FFFFFF;



}







#maintopic {
	position: absolute;
	left: 3px;
	top: 0px;
	width: 960px;
	height: inherit;
	border-top: 1px solid #cdcdcd;
	background: url(../images/pmt.gif) repeat-x;
	overflow: visible;

	font-family: Verdana, Tahoma, sans-serif;




}







#plaintext {



	position: absolute;



	left: 700px;



	top: 86px;



	width: 195px;



	height: 30px;



	text-align: right;



	z-index: 100;



}







#plaintext a {



	color: #888888;



	text-decoration: none;



}











#youarehere {
	position: absolute;
	left: 5px;
	top: 33px;
	width: 900px;
	height: 30px;
	font-style: italic;
	font-family: Verdana, Arial, Helvetica, sans-serif;



}







#youarehere a {



	display: block;



	float: left;



	height: 30px;



	padding: 0px 10px 0px 23px;



	line-height: 30px;



	color: #888888;



	text-decoration: none;



	font-size: 11px;



	background : url(../images/pmr.gif) no-repeat;



}







#youarehere a:hover {



	color: #82665A;



	background : url(../images/pmra.gif) no-repeat;



}











#maintopic a {



	display: block;



	float: left;



	height: 30px;



	padding: 0px 5px 0px 5px;



	line-height: 30px;



	color: #A7C4BF;



	text-decoration: none;



	text-transform: uppercase;



	font-size: 9px;



	letter-spacing : 1px;



	background : url(../images/pln.gif) no-repeat right;



}







#maintopic a:hover {



	background: url(../images/pmta.gif) repeat-x;



	color: #587046;



}







#maintopic a.active {



	background: url(../images/pmta.gif) repeat-x;



	color: #333333;



	font-weight: bold !important;





}











#topic {

position:absolute;
top:80px;
left:8px;
	width: 220px;
	background-color: #C2DBBF;
	font-size: 12px;
	color: #000000;
	overflow: visible;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform: none;
	font-weight: lighter;
	font-style: normal;
	border: 0px;
	border-style: solid;
float:left;



}



#right {
position:absolute;
top:80px;
left:730px;
	width:260px;
	height:auto;
	z-index:1;
	border: 0px;
	border-style: solid;
	overflow: visible;
	background-color: #F9FBED;



}


#content {
position:absolute;
top:80px;
left:200px;
	width: 480px;
	padding: 0px;
	margin: 0px;
	height: auto;
	color: #bbb;

float:left;
padding:20px;
margin:0px 20px;

}

div #content object{text-align:center; margin-left:20px;}

div #content p { text-align:left;}
div #content p a{color:#78D2DE;}

div #content h1{color:#78D2DE;}



#topic a {



	display: block;



	color: #ffffff;



	text-decoration: none;



	border-bottom: 1px solid #D2C4C1;



	padding: 0px;



	margin: 3px 20px 3px 20px;



	text-transform: uppercase;



	font-size: 10px;



}







#topic p {



	text-align: center;



}







#topic p a {



	border-bottom: none !important;	



}







#topic a:hover, #topic a.active {
	color: #000000;



}







#topic h1 {
	padding: 9px 20px 9px 20px;
	background-color: #D3EECE;
	font-size: 14px;
	font-weight: lighter;
	color: #7F90B4;
	letter-spacing: 1px;
	margin: 0px;



}







#eyecatcher {
	position: absolute;
	left: 203px;
	top: 145px;
	width: 700px;
	height: 150px;
	background: url(../images/peye.jpg) no-repeat;
	background-image: url(../images/peye.jpg);



}












#sidebar {



	position: absolute;



	top: 296px;



	left: 750px;



	width: 200px;



	background-color: #82665A;



	color: #fffff;



}







form.search {

	position: absolute;

	top: 23px;

	left: 714px;

	width: 160px;



}







form.search input {



	margin: 0px;



	vertical-align : middle;



}







input.search {



	border : 1px solid #cdcdcd;



	color: #333333;



	width: 118px;



	padding: 2px;



	background: url(../images/pmt.gif) repeat-x;



	font-size: 10px;



}

.style1 {font-size: xx-small

}

#background {
	height:1700px;
}
.style3 {font-size: 9px}
.style18 {font-size: 16px; color: #003300;}
.style19 {
	font-size: 12px;
	color: #000000;
}
.style20 {
	color: #000000
}
.style22 {font-size: 16px; color: #CC3366; }
.style28 {font-size: 16}
body {
	margin-left: 0px;
	background-color: ;
}
#main #background #inhalt #topic div {
	background-color: #D3EECE;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #7F90B4;
	padding: 9px 20px 9px 20px;
	margin: 0;
	font-weight: lighter;
}
.style30 {
	font-size: 14px;
	color: #D3EECE;
}
.style31 {

	padding: 9px 20px 9px 20px;
}
.style32 {font-size: 16px; color: #7F90B4; }

#right strong{color:#A7C4BF;}

hope that helps :santa:

 

[xsnow]

Cappa has some nice warm flowing colors.

 

[Jacklin]

Some nice colours out there .. I like the second and third one most ...

The greens are a little harsh for a 'meditation' website.
How about some of these combinations:

 

[Coolprogram]

I would agree with cappa1_2000 on this. Green is a little to strong. Now, if it was a little lighter it would look a little better, otherwise the colors he/she gave you would work beautifully and possibly a mixture of two colors such as a light red and pink maybe...
Hope this helps,
-Coolprogram

 

[Minneola24]

Yeah the colors on there now are not that soothing, I think if you go with light colors and drop the black you would be in good shape. Try kuler.adobe.com for some good color schemes.

Good luck

 

[devzealot]

Kinda going against what some are saying here but i think your site needs both darker
and light colors not just light. Too many light shades does not look good as it does not
give good contrasting.

 

[Toni]

thank you guys...

am still trying to optimize it...

 

[devzealot]

thank you guys...

am still trying to optimize it...

No problem. I think the best thing you can do to start with is change the background color to a soft light color, this will make it instantly look better. The what I would do is make the sidebars darker type colors and the rest light colors ..... but it really is trail and error, just keep swapping things around untill it looks great!!! :bingo:

 

[Finnerup]

I like the layout, it looks serious.
I'm not sure, but i think your "orange" toolbars will suit a light blue perfect!
The "orange" ones might look a little "old school".

Good Luck

 

[Barnard]

I have not much experience about it but my idea is that color combination should be as look very beautiful and calm. That user can work with easily if it is more bright it will be difficult to bear it and if it is more light user will be boring during its visit. So be careful about it.

 

[ben_at_run]

Light colors should be more attractive because when spiritual word comes on mind then softness feels around so not use dark colors.........

 

[Sunite]

The colours now seem to be fine, but for me it hurts my eye a little, and i do not like sites which hurt my eye, lowering the white to something like light blue would be good.