8 bit HTML art

in #art3 years ago (edited)

1_uSYPQWFlFLMA8mUSWfZlAw[1].jpeg

  1. https://codepen.io/ (moving on to visualization)
  2. click start coding
  3. copy my html code:
    <svg style............(delete this space)...................
    .....="background: lime; width:16px; height:18px;">
    <rect x="5" y="1" width="1" height="1"fill="red">
    <rect x="6" y="1" width="1" height="1"fill="red">
    <rect x="7" y="1" width="1" height="1"fill="red">
    <rect x="8" y="1" width="1" height="1"fill="red">
    <rect x="9" y="1" width="1" height="1"fill="red">

<rect x="4" y="2" width="1" height="1"fill="red">
<rect x="5" y="2" width="1" height="1"fill="red">
<rect x="6" y="2" width="1" height="1"fill="red">
<rect x="7" y="2" width="1" height="1"fill="red">
<rect x="8" y="2" width="1" height="1"fill="red">
<rect x="9" y="2" width="1" height="1"fill="red">
<rect x="10" y="2" width="1" height="1"fill="red">
<rect x="11" y="2" width="1" height="1"fill="red">
<rect x="12" y="2" width="1" height="1"fill="red">

<rect x="4" y="3" width="1" height="1"fill="black">
<rect x="5" y="3" width="1" height="1"fill="black">
<rect x="6" y="3" width="1" height="1"fill="black">
<rect x="7" y="3" width="1" height="1"fill="Bisque">
<rect x="8" y="3" width="1" height="1"fill="Bisque">
<rect x="9" y="3" width="1" height="1"fill="black">
<rect x="10" y="3" width="1" height="1"fill="Bisque">

<rect x="3" y="4" width="1" height="1"fill="black">
<rect x="4" y="4" width="1" height="1"fill="Bisque">
<rect x="5" y="4" width="1" height="1"fill="black">
<rect x="6" y="4" width="1" height="1"fill="Bisque">
<rect x="7" y="4" width="1" height="1"fill="Bisque">
<rect x="8" y="4" width="1" height="1"fill="Bisque">
<rect x="9" y="4" width="1" height="1"fill="black">
<rect x="10" y="4" width="1" height="1"fill="Bisque">
<rect x="11" y="4" width="1" height="1"fill="Bisque">
<rect x="12" y="4" width="1" height="1"fill="Bisque">

<rect x="3" y="5" width="1" height="1"fill="black">
<rect x="4" y="5" width="1" height="1"fill="Bisque">
<rect x="5" y="5" width="1" height="1"fill="black">
<rect x="6" y="5" width="1" height="1"fill="black">
<rect x="7" y="5" width="1" height="1"fill="Bisque">
<rect x="8" y="5" width="1" height="1"fill="Bisque">
<rect x="9" y="5" width="1" height="1"fill="Bisque">
<rect x="10" y="5" width="1" height="1"fill="black">
<rect x="11" y="5" width="1" height="1"fill="Bisque">
<rect x="12" y="5" width="1" height="1"fill="Bisque">
<rect x="13" y="5" width="1" height="1"fill="Bisque">

<rect x="3" y="6" width="1" height="1"fill="black">
<rect x="4" y="6" width="1" height="1"fill="black">
<rect x="5" y="6" width="1" height="1"fill="Bisque">
<rect x="6" y="6" width="1" height="1"fill="Bisque">
<rect x="7" y="6" width="1" height="1"fill="Bisque">
<rect x="8" y="6" width="1" height="1"fill="Bisque">
<rect x="9" y="6" width="1" height="1"fill="black">
<rect x="10" y="6" width="1" height="1"fill="black">
<rect x="11" y="6" width="1" height="1"fill="black">
<rect x="12" y="6" width="1" height="1"fill="black">

<rect x="5" y="7" width="1" height="1"fill="Bisque">
<rect x="6" y="7" width="1" height="1"fill="Bisque">
<rect x="7" y="7" width="1" height="1"fill="Bisque">
<rect x="8" y="7" width="1" height="1"fill="Bisque">
<rect x="9" y="7" width="1" height="1"fill="Bisque">
<rect x="10" y="7" width="1" height="1"fill="Bisque">
<rect x="11" y="7" width="1" height="1"fill="Bisque">

<rect x="4" y="8" width="1" height="1"fill="blue">
<rect x="5" y="8" width="1" height="1"fill="blue">
<rect x="6" y="8" width="1" height="1"fill="red">
<rect x="7" y="8" width="1" height="1"fill="blue">
<rect x="8" y="8" width="1" height="1"fill="blue">
<rect x="9" y="8" width="1" height="1"fill="blue">

<rect x="3" y="9" width="1" height="1"fill="blue">
<rect x="4" y="9" width="1" height="1"fill="blue">
<rect x="5" y="9" width="1" height="1"fill="blue">
<rect x="6" y="9" width="1" height="1"fill="red">
<rect x="7" y="9" width="1" height="1"fill="blue">
<rect x="8" y="9" width="1" height="1"fill="blue">
<rect x="9" y="9" width="1" height="1"fill="red">
<rect x="10" y="9" width="1" height="1"fill="blue">
<rect x="11" y="9" width="1" height="1"fill="blue">
<rect x="12" y="9" width="1" height="1"fill="blue">

<rect x="2" y="10" width="1" height="1"fill="blue">
<rect x="3" y="10" width="1" height="1"fill="blue">
<rect x="4" y="10" width="1" height="1"fill="blue">
<rect x="5" y="10" width="1" height="1"fill="blue">
<rect x="6" y="10" width="1" height="1"fill="red">
<rect x="7" y="10" width="1" height="1"fill="blue">
<rect x="8" y="10" width="1" height="1"fill="blue">
<rect x="9" y="10" width="1" height="1"fill="red">
<rect x="10" y="10" width="1" height="1"fill="blue">
<rect x="11" y="10" width="1" height="1"fill="blue">
<rect x="12" y="10" width="1" height="1"fill="blue">
<rect x="13" y="10" width="1" height="1"fill="blue">

<rect x="2" y="11" width="1" height="1"fill="Bisque">
<rect x="3" y="11" width="1" height="1"fill="Bisque">
<rect x="4" y="11" width="1" height="1"fill="blue">
<rect x="5" y="11" width="1" height="1"fill="blue">
<rect x="6" y="11" width="1" height="1"fill="red">
<rect x="7" y="11" width="1" height="1"fill="red">
<rect x="8" y="11" width="1" height="1"fill="red">
<rect x="9" y="11" width="1" height="1"fill="red">
<rect x="10" y="11" width="1" height="1"fill="blue">
<rect x="11" y="11" width="1" height="1"fill="blue">
<rect x="12" y="11" width="1" height="1"fill="Bisque">
<rect x="13" y="11" width="1" height="1"fill="Bisque">

<rect x="2" y="12" width="1" height="1"fill="Bisque">
<rect x="3" y="12" width="1" height="1"fill="Bisque">
<rect x="4" y="12" width="1" height="1"fill="Bisque">
<rect x="5" y="12" width="1" height="1"fill="red">
<rect x="6" y="12" width="1" height="1"fill="Yellow">
<rect x="7" y="12" width="1" height="1"fill="red">
<rect x="8" y="12" width="1" height="1"fill="red">
<rect x="9" y="12" width="1" height="1"fill="Yellow">
<rect x="10" y="12" width="1" height="1"fill="red">
<rect x="11" y="12" width="1" height="1"fill="Bisque">
<rect x="12" y="12" width="1" height="1"fill="Bisque">
<rect x="13" y="12" width="1" height="1"fill="Bisque">

<rect x="2" y="13" width="1" height="1"fill="Bisque">
<rect x="3" y="13" width="1" height="1"fill="Bisque">
<rect x="4" y="13" width="1" height="1"fill="red">
<rect x="5" y="13" width="1" height="1"fill="red">
<rect x="6" y="13" width="1" height="1"fill="red">
<rect x="7" y="13" width="1" height="1"fill="red">
<rect x="8" y="13" width="1" height="1"fill="red">
<rect x="9" y="13" width="1" height="1"fill="red">
<rect x="10" y="13" width="1" height="1"fill="red">
<rect x="11" y="13" width="1" height="1"fill="red">
<rect x="12" y="13" width="1" height="1"fill="Bisque">
<rect x="13" y="13" width="1" height="1"fill="Bisque">

<rect x="4" y="14" width="1" height="1"fill="red">
<rect x="5" y="14" width="1" height="1"fill="red">
<rect x="6" y="14" width="1" height="1"fill="red">
<rect x="9" y="14" width="1" height="1"fill="red">
<rect x="10" y="14" width="1" height="1"fill="red">
<rect x="11" y="14" width="1" height="1"fill="red">

<rect x="3" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="4" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="5" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="10" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="11" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="12" y="15" width="1" height="1"fill="SaddleBrown">

<rect x="2" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="3" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="4" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="5" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="10" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="11" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="12" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="13" y="16" width="1" height="1"fill="SaddleBrown">

  1. paste into the html window
  2. rejoice :)

Coin Marketplace

STEEM 0.17
TRX 0.13
JST 0.027
BTC 61059.95
ETH 2677.49
USDT 1.00
SBD 2.61