: Is there a hard and fast rule for choosing colours to make text appear inset I've always liked the look of inset text on web pages so I try to use it every now and again. (Sparingly and

@Jennifer810

I'm not entirely sure whether you mean "debossed" or "cut out". Either way, there are a few things to keep in mind:


A shadow takes on the color of what it falls on, but is often shifted a bit toward blue. This is a built-in expectation from daylight: shadows are lit by blue sky.
Translucent materials lend their color to the shadow, because they filter the light.
If you are creating the illusion of colored light, the shadow does NOT take on the color of that light if the material is opaque.
Darker shadow and harder edge for small "distances" between the face and the cut out text; less dense shadow and softer edge if the text is "deeper."
Text color and shade depend entirely on the mood you're trying to create. Same as foreground (background?) gives a peaceful, quiet mood. Strong contrast delivers a more dynamic message. Which you need in a particular project depends on the context.


Just as a general point, any time you are trying to create an illusion like this, your first action should be to go look at (or make) at examples in the real world. Observation is the ultimate teacher.

Vote Up Vote Down

@Cofer715

The rule is that there is no rule. You need to follow your eye and trust what you see. There are even some instances where you might use a purple shadow on yellow. I don't advise it, but it can be appropriate.

The other obvious problem with a rule is that it will break at the ends: how do you highlight pure white or cast a defined shadow on pure black?

Whatever you do should probably be consistent on the end product, but there is no need to be consistent from site to site (brand to brand etc)

Vote Up Vote Down