Skip to the content.

Images, Base64, Color Codes w/ homeworks

Popcorn Hacks

Digital Images

Q: Which format would you use for an image with a transparent background that must stay sharp on any screen?
A: SVG – vector graphics scale without losing clarity and support transparency.

Base64

Q: Name one downside of Base64 in real-world use.
A: It enlarges data by about 33 percent, increasing bandwidth and memory costs.


Homework Hack

  1. What is a hex color code? Give examples.
    A six-digit hexadecimal value representing red, green, and blue intensities.
    Examples: #FF0000 (red), #00FF00 (green), #0000FF (blue).

  2. What is Base64 and how is it used with images?
    Base64 encodes binary image data as ASCII text so it can be embedded directly in HTML, CSS, or JSON.

  3. Why might you use Base64 instead of a regular image file?
    • Combines small assets with the page to avoid extra HTTP requests.
    • Works in text-only channels such as email.
    • Simplifies bundling single-file apps or demos.
  4. Insert an image in a Jupyter notebook and explain how it is stored/displayed.
    ```python from IPython.display import Image Image(filename=”picture.png”)