How to emulate the look of an off-white sheet of paper on a computer screen

Question

Thanks for the comments below. In hindsight, I should have been more detailed. I hope the edited version is clearer.

At a high-level, I want to emulate the look of paper as a screen background. This is because I find white (#FFFFF) to be too bright. I looked at a few hardcover books I own and noticed that none of them are bright white. The Kindle screen background is also not bright white.

Hence I would like to find out what is the best way to emulate the look of off-white paper on the screen. I don't want the background to be too "showy" and draw attention (I've seen swatches which emulate handmade paper with some colored thread within, I don't want that): it should just be there.

Is a single RGB value enough, do I need a repeated swatch? If RGB is enough, which ones work best? Are there websites/blogs where this has been discussed?

A seamless repeatable swatch which I can use as a background image is also OK.

I played around with some color wheels to discover an RGB value and this is the best I could do: rgb(252, 245, 216) == #FCF5D8, but I think I can do better. You see what that color looks by pasting the RGB value here: http://www.colorschemer.com/online.html

Answer 1

All of my hardcover books are printed on depleted uranium. So their normal color is rgb(22, 44, 22)

Seriously, it depends on the book. Is it an old book or a new one for starters?

Adding a little more to this:

If you are going for a printed-on-paper look you are better off using an image than a single color, since paper is not perfect.

Answer 2

It's the texture that matters as well.

Answer 3

i would load the body with a texture ..

body {
  background-image: url(path-to-texture.png);
  background-color: predominent color of that texture;
}

you can google for 'paper texture' and come up with dozens

Answer 4

This is very difficult to do well due to the great colour discrepancies in output devices. What is a nice, almost imperceptible yellowish tinge on one screen, may be perceived as a dirty haze on another. Just put any two screen from different lines/brands next to each other and you'll see what I mean. Depending on what this is for (personal settings / web site / application) you should leave options open to the user.

If you are looking for eye-friendly design, you may also want to look at the foreground color. I am currently building a web application and have adopted a style i which text is entirely blue (0000FF) or navy blue (0000BF) and find the results much easier on the eye than black.

Answer 5

The goal is drowing corners, "dog's ears"

Answer 6

It has also been shown that black on white tires our eyes out faster. However, I just go with very subtle off white colors much of the time. While black on white is the highest contrast possible, black on yellow has been shown to be the most readable. Think legal pads and school busses.

It makes no sense to talk about the "color" of the printed page or a kindle, in the same way as monitor color because these are reflective surfaces and simply reflect the color that shines on them. Paper "brightness" is measured in how much light reflects off the surface. Extremely bright paper may reflect 98% or 99% of light.

The new css3 guidelines allow for hsl colors. This means that you can choose 1-2 hues, and adjust the sat and luminance values for a consistent color scheme. specs. Once you have a color, try a low sat, high lum for your background. Much easier that reconfiguring RGB all the time. Just don't ask me about browser compatibility :-)