Solved

Suggestions for text color and font on grey background

Posted on 2010-11-26
8
782 Views
Last Modified: 2013-11-19
Can anybody suggest some colors and simple fonts fot text (heading) on a grey background. Please check the image attached.

Thank you!         color suggestion
0
Comment
Question by:dshrenik
  • 2
  • 2
  • 2
  • +2
8 Comments
 
LVL 3

Accepted Solution

by:
roynaufal earned 100 total points
ID: 34221587
verdana with one of these colors should look nice:
#3baabb
#33CCCC
#96BC43
0
 
LVL 23

Assisted Solution

by:jeremyjared74
jeremyjared74 earned 200 total points
ID: 34221788
Here are some suggestions and the code to go with it: Headers
Arial Font White CSS:

h1, h2, h3, h4, h5, h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFF;
h1 {
	font-size: 42px;
}
h2 {
	font-size: 34px;
}
h3 {
	font-size: 24px;
	}
h4 {
	font-size: 18px;
	}
h5 {
	font-size: 16px;
	}
h6 {
	font-size: 14px;
	font-variant: small-caps;

	}
	
=================================================

Trebuchet MS Font White CSS:

h1, h2, h3, h4, h5, h6 {
	font-family: "Trebuchet MS";
	font-weight: bold;
	color: #FFF;
h1 {
	font-size: 36px;
}
h2 {
	font-size: 32px;
}
h3 {
	font-size: 24px;
	}
h4 {
	font-size: 18px;
	}
h5 {
	font-size: 16px;
	}
h6 {
	font-size: 14px;
	font-variant: small-caps;

	}
	
=================================================

Palatino Linotype Font White CSS:

h1, h2, h3, h4, h5, h6 {
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-weight: bold;
	color: #FFF;
h1 {
	font-size: 42px;
}
h2 {
	font-size: 34px;
}
h3 {
	font-size: 24px;
	}
h4 {
	font-size: 18px;
	}
h5 {
	font-size: 16px;
	}
h6 {
	font-size: 14px;
	font-variant: small-caps;

	}

=================================================

Trebuchet MS Font White CSS:

h1, h2, h3, h4, h5, h6 {
	font-family: "Trebuchet MS";
	font-weight: bold;
	color: #FFF;
h1 {
	font-size: 36px;
}
h2 {
	font-size: 32px;
}
h3 {
	font-size: 24px;
	}
h4 {
	font-size: 18px;
	}
h5 {
	font-size: 16px;
	}
h6 {
	font-size: 14px;
	font-variant: small-caps;

	}
	
=================================================

Palatino Linotype Font Red CSS:

h1, h2, h3, h4, h5, h6 {
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-weight: bold;
	color: #550000;
h1 {
	font-size: 42px;
}
h2 {
	font-size: 34px;
}
h3 {
	font-size: 24px;
	}
h4 {
	font-size: 18px;
	}
h5 {
	font-size: 16px;
	}
h6 {
	font-size: 14px;
	font-variant: small-caps;

	}

Open in new window

0
 

Author Comment

by:dshrenik
ID: 34222570
I dont need any code. More snapshots with font name and color will be good enough.
Thanks!
0
 
LVL 23

Assisted Solution

by:jeremyjared74
jeremyjared74 earned 200 total points
ID: 34222655
Ok, here are a few more:
More-Fonts.jpg
0
Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

 
LVL 2

Assisted Solution

by:garfld
garfld earned 100 total points
ID: 34230544
Navy blue is gorgeous with grey.

Georgia is a very elegant font and everybody has it.
0
 
LVL 38

Assisted Solution

by:BillDL
BillDL earned 100 total points
ID: 34241285
It really all depends entirely what overall effect you want on the viewer.  You might be looking for more of a blending of shades so that the text heading appears to be chiselled into the background or embossed onto it, in which case you could use a darker shade of grey. Depending on what image editing applications you have at your disposal, you could use more than one colour and create a 3-D type of text effect.

To make the text heading stand out most dramatically and just appear quite obviously as text on a background with the maximum visibility, you could start off with a text colour that is an almost exact opposite (ie. negative) colour of the background. The grey background to your header is (R,G,B) A9, B0, BB. Making the image a negative, the opposing colour is 56, 4F, 44, so you could try that for a starting colour and adjust.

It looks like you are creating image GUI parts for a program or application judging by your "theme" image name.  You could draw some inspiration by creating a new Windows Theme or colour "scheme" and see how the Title Bar, etc. shows, then use the same colours.

Sorry for not providing screenshots, but what I'm trying to say is that different people have very different tastes and there are so many hues of the same basic colour that you may get 200 screenshots, you would like 2 of them, I would like a few of the others, and each other person reading this would like yet another couple.  While you may look at your favourites and say "Yes! That's perfect", I might look at the same ones and say "Oh, no! That just doesn't look right".

It depends on what you intend to use the image(s) for.  One rendering might look perfect for elements of a web-based application in a whole web page, but not for some other application installed on someone's computer where you are just seeing a dialogue in isolation.

If this was a poster for some marketing use I suppose there would be some basic "rules" about what works and doesn't work for best visual impact, or what makes for a seamless blending of components, but even "rules" are open to individual interpretation dependent entirely on the desired effect on the eye.

So, what are you going to use the image for?
0
 

Author Comment

by:dshrenik
ID: 34244627
Thanks for the very informative mail!
The screenshot I posted is actually a PowerPoint slide from my presentation.
I have got some very nice suggestions, but just looking to have a few more! :)
0
 
LVL 38

Expert Comment

by:BillDL
ID: 34277106
Thank you dshrenik
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Suggested Solutions

I. Introduction In a previous article (http://www.experts-exchange.com/Web_Development/Document_Imaging/A_6537-PaperPort-Upgrade-How-to-download-and-install-updated-versions-of-PaperPort-11-and-12.html) (now deprecated), I discussed how to upgrad…
Many programs have tried to outwit PowerPoint in terms of technology and skill. These programs, however, still lack several characteristics that PowerPoint has possessed from the start. Here's why PowerPoint replacements won't entirely work for desi…
The goal of the tutorial is to teach the user how to import photos into Adobe Lightroom efficiently and to keep everything organized.
In addition to being a great web-based presentation tool, Prezi also makes it easy to save your presentation as a PDF to share with others as well. Learn how in this tutorial. Select the share icon from the top menu in your Prezi editor: Select "D…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now