GD-ML/AndroidCode

1<!DOCTYPE html>2<html lang="en">3<head>4<meta charset="UTF-8" />5<meta name="viewport" content="width=1080, initial-scale=1.0" />6<title>Gallery App Icon Screen</title>7<style>8  body { margin: 0; padding: 0; background: transparent; font-family: Arial, Helvetica, sans-serif; }9  #render-target {10    width: 1080px;11    height: 2400px;12    position: relative;13    overflow: hidden;14    background: #000000;15  }16 17  /* Top status bar */18  .status-bar {19    position: absolute;20    top: 0;21    left: 0;22    width: 1080px;23    height: 120px;24    background: #131313;25  }26 27  /* App icon area */28  .app {29    position: absolute;30    left: 380px; /* centered for 1080px width with 320px icon */31    top: 1540px;32    width: 320px;33    text-align: center;34  }35 36  .icon-tile {37    width: 320px;38    height: 320px;39    border-radius: 70px;40    background: #0F6FE9;41    box-shadow: 0 14px 28px rgba(0,0,0,0.35);42    overflow: hidden;43  }44 45  .app-label {46    margin-top: 28px;47    font-size: 60px;48    line-height: 1;49    color: #FFFFFF;50    font-weight: 500;51    letter-spacing: 0.5px;52  }53</style>54</head>55<body>56<div id="render-target">57  <div class="status-bar"></div>58 59  <div class="app">60    <div class="icon-tile">61      <!-- Simple flower using inline SVG to evoke the Gallery icon -->62      <svg width="320" height="320" viewBox="0 0 320 320" xmlns="http://www.w3.org/2000/svg">63        <defs>64          <linearGradient id="petalGrad" x1="0" y1="0" x2="1" y2="1">65            <stop offset="0" stop-color="#FFEB3B"/>66            <stop offset="1" stop-color="#FFC107"/>67          </linearGradient>68        </defs>69        <!-- Petals -->70        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(0 160 160)"/>71        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(45 160 160)"/>72        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(90 160 160)"/>73        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(135 160 160)"/>74        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(180 160 160)"/>75        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(225 160 160)"/>76        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(270 160 160)"/>77        <ellipse cx="160" cy="70" rx="90" ry="45" fill="url(#petalGrad)" transform="rotate(315 160 160)"/>78        <!-- Center ring -->79        <circle cx="160" cy="160" r="22" fill="#FFE082" stroke="#FFF8E1" stroke-width="8"/>80      </svg>81    </div>82    <div class="app-label">Gallery</div>83  </div>84</div>85</body>86</html>