repl.it
@Coding1000/

Ps4 Outline

HTML, CSS, JS

No description

fork
loading
Files
  • index.html
  • script.js
  • style.css
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
74.7c0,6.4-6.9,10.8-16.2,10.8c-9.3,0-16.5-5.2-16.5-11.5" ></path>
        <path d="M206.8,563.9L194.2 570.3 204.8 578.6 218.2 571.6 z"></path>
      </g>
      <!-- X -->
      <g>
        <ellipse cx="155.4" cy="558.8" rx="16.9" ry="11.5"></ellipse>
        <path d="M171.7,561.9c0,6.4-6.9,10.8-16.2,10.8c-9.3,0-16.5-5.2-16.5-11.5" ></path>
        <line x1="154.1" y1="565.5" x2="156.5" y2="551.7"></line>
        <line x1="165.1" y1="558.8" x2="146.1" y2="556.4"></line>
      </g>
      <!-- Circle -->
      <g>
        <ellipse cx="136.7" cy="589.1" rx="16.9" ry="11.5"></ellipse>
        <path d="M152.9,592.3c0,6.4-6.9,10.8-16.2,10.8c-9.3,0-16.5-5.2-16.5-11.5" ></path>
        <ellipse cx="136.3" cy="588.6" rx="9" ry="6.6"></ellipse>
      </g>
    </g>
  </g>

  <!-- PS4 -->
  <g>
    <!-- Top Outline -->
    <g>
      <path d="M746,460L769 386 1165 131 1144 199 z"></path>
      <path d="M1165,131L758 51 756 54 751.4 52.8 753.4 49 522 1 81 207 328 270 769 386 "></path>
      <path d="M315.4,345.4L335.6 272 758 51 "></path>
      <path d="M309.4,343.4L330.5 270.7 753.4 49 "></path>
      <path d="M81,207L58 276.7 746 460 "></path>
    </g>
    <!-- Bottom Outline -->
    <g>
      <path d="M547.3,522.3L712.7 569.4 1116.7 295.5 1134.7 227.4 1108.9 222.7 "></path>
      <path d="M90,286.1L49.4 308.7 29.4 378 277.4 447.4 286.1 440.8 284 447.4 311.3 455.1 "></path>
      <path d="M49.4,308.7L734.7 494.7 1134.7 227.4 "></path>
      <line x1="277.4" y1="447.4" x2="297.5" y2="376.1"></line>
      <line x1="284" y1="447.4" x2="305.6" y2="378.5"></line>
    </g>

    <!-- Middle Outline -->
    <g>
      <path d="M93.2,286.1L93.2 300 427.2 390.6 "></path>
      <path d="M724.4,454.3L724.4 470.7 531.4 420.9 "></path>
      <line x1="724.4" y1="470.7" x2="734.9" y2="467"></line>

      <!-- Ports -->
      <g>
        <path d="M440.4,382.4L440.4 396.1 467.9 403 467.9 389 z"></path>
        <line x1="443" y1="392.7" x2="465" y2="397.7"></line>
      </g>
      <g>
        <path d="M499.3,398.5L499.3 412.2 526.8 419.2 526.8 405.2 z"></path>
        <line x1="502" y1="408.8" x2="524" y2="413.8"></line>
      </g>
    </g>
    <!-- PS4 Logo -->
    <g>
      <path d="M633.5,399.4l3.5-8.5l17.2,5.2c2.4,0.1,9.7-2.7,3.8-9l-18.5-5.2" ></path>
      <path d="M691.9,396.1l-10.7-3.8c0,0-2.7-1-4,1.9l-4.7,12.6c0,0-1.3,2.3-4,1.5l-9.8-3.2" ></path>
      <path d="M706.9,420.9L714.2 401.9 689 410 713.2 418.5 "></path>
    </g>
  </g>
</svg>

  </body>
</html>
result
console
?