CS110: Computer Science and the Internet. Binary Recap Color & Images. Homework 2 http :// cs.wellesley.edu /~cs110/assignments/ assignmentPageLayout / index.shtml Clarification Project http:// cs.wellesley.edu /~cs110/students/ accounts.html. Binary is Magic!. ASCII code.
CS110: Computer Science and the Internet
Binary RecapColor & Images
Binary is Magic!
ASCII code allows 256 “characters” to be represented
UTF-8 encodes more than 1 million characters from the Unicode character set
All standards-compliant browsers should handle these color names
These color names can be used with the CSS properties of color and background-color:
For other colors, it’s safest to use a numericalrepresentation…
Human retina: 3 kinds of color-sensitive photoreceptors, traditionally called red, green, and blue cones
Visible colors can be created by adding different amounts of the three primary colors, red, green, and blue
Color monitors display colors by adding different amounts of red, green, and blue light
RGB color components are usually defined on a scale from 0 to 255
Over 16 million colors can be represented this way!
Two ways to specify turquoise using rgb in CSS:
Try this game:
Numbers in the range 0-255 are represented in base 16, using two “digits” that each have 16 possible values, drawn from 0..9, A..F
# 94 00 D3
Using hexadecimal colors in CSS:
38 pixels high
44 pixels wide
Images are often represented in a computer as a 2-dimensional (2D) array of pixels
RGB color for each pixel is stored in 24 bits (3 bytes)
How much memory is needed to store a 300x500 pixel image?
2 bits per pixel
24 bits per color
“bits per pixel” is also called the “bit depth”
bit depth must be large enough to store all the colors
GIF Indexed Color
The GIF file format is an indexed color format that allows 256 colors (out of a possible 16 million colors!)
Other Image Formats
- millions of colors, compressed, nice for photos, does not allow transparency
- millions of colors, compressed, nice for line art and graphics, allows 8-bit transparency
- limited to 256 colors, nice for line art and graphics, allows 1-bit transparency, supports animation
Generate all formats and compare with Pixlr!