-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
162 lines (152 loc) · 9.29 KB
/
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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<!DOCTYPE HTML>
<html>
<head>
<title>Zoom Virtual Backgrounds</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" />
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
<link rel="shortcut icon" href="https://YourFaviconLinkHere.ico" type="image/x-icon"/>
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<h1><a href="index.html"><strong>Zoom Virtual Backgrounds</strong></a></h1>
<nav>
<ul>
<li><a href="#footer" class="icon solid fa-info-circle">About</a></li>
</ul>
</nav>
</header>
<!-- Main -->
<div id="main">
<article class="thumb">
<a href="https://cdn.mos.cms.futurecdn.net/qaZTiYPSkHQnf8MCurR3th-970-80.jpg.webp" class="image" download><img src="https://cdn.mos.cms.futurecdn.net/qaZTiYPSkHQnf8MCurR3th-970-80.jpg.webp" alt="" /></a>
<h2>Star Wars</h2>
<p>Why not dial into your Zoom meeting from a galaxy far, far away? <a href="https://www.starwars.com/news/star-wars-backgrounds">StarWars.com </a>released a bunch of free Zoom backgrounds. So, you can look like you're floating in Cloud City, in the control room of the Death Star, strolling around Tatooine or braving the icy weather of Hoth, among many choices. <a href="https://cdn.mos.cms.futurecdn.net/qaZTiYPSkHQnf8MCurR3th-970-80.jpg.webp" download="images/fulls/StarWars">Download</a>
</p>
</article>
<article class="thumb">
<a href="images/fulls/OuterSpace.jpeg" class="image"><img src="images/thumbs/OuterSpace.jpeg" alt="" /></a>
<h2>OuterSpace</h2>
<p><a href="images/fulls/OuterSpace.jpeg" download="images/fulls/OuterSpace.jpeg">Download</a></p>
</article>
<article class="thumb">
<a href="images/fulls/TheOffice.jpg" class="image"><img src="images/thumbs/TheOffice.jpg" alt="" /></a>
<h2>The Office</h2>
<p><a href="images/fulls/TheOffice.jpg" download="images/fulls/TheOffice.jpeg">Download</a></p>
</article>
<article class="thumb">
<a href="images/fulls/Hogwards.jpg" class="image"><img src="images/thumbs/Hogwards.jpg" alt="" /></a>
<h2>Hogwards</h2>
<p>Photo by <a href="https://unsplash.com/@jmeguilos">@jmeguilos</a>from unsplash. <a href="images/fulls/Hogwards.jpg" download="images/fulls/Hogwards.jpeg">Download</a></p>
</article>
<article class="thumb">
<a href="images/fulls/Marvel.webp" class="image"><img src="images/thumbs/Marvel.webp" alt="" /></a>
<h2>Marvel</h2>
<p>Video call backgrounds, assemble! Yes, Marvel got into the free Zoom backgrounds universe, <a href="https://twitter.com/Marvel/status/1246143367341387777"> tweeting </a>out several images from MCU films including Black Panther, Iron Man and Doctor Strange.<a href="images/fulls/Marvel.webp" download="images/fulls/Marvel">Download</a></p>
</article>
<article class="thumb">
<a href="images/fulls/IronThrone.webp" class="image"><img src="images/thumbs/IronThrone.webp" alt="" /></a>
<h2>GOT Iron Throne</h2>
<p>No need to battle the Lannisters, Starks, Baratheons or any other noble house of Westeros for the Iron Throne — you can just plop yourself on it via a free Zoom background. Credit:HBO
<a href="images/fulls/IronThrone.webp" download= "images/fulls/IronThrone">Download</a></p>
</article>
<article class="thumb">
<a href="https://media3.giphy.com/media/WmoxwHDdDhSE7tHcAN/giphy.gif" class="image"><img src="https://media3.giphy.com/media/WmoxwHDdDhSE7tHcAN/giphy.gif" alt="" /></a>
<h2>Giphy Backdrops</h2>
<p>Zoom backgrounds don't have to be a static image. You can use a GIF, like this pre-made collection from <a href="">Giphy</a>. Choose to sit in front of a seaside landscape with a moving sailboat or a bubbling waterfall. Our favorite is the city with floating animals like jellyfish and a whale.
<a href="images/giphy.gif" download= "images/giphy.gif">Download</a></p>
</article>
<article class="thumb">
<a href="images/VBector.png" class="image"><img src="images/VBector.png" alt="" /></a>
<h2>Name Placard</h2>
<p>Make your own placard on <a href="https://canva.7eqqol.net/c/221109/619765/10068?subId1=tomsguide-us-8074597824085818000&u=https%3A%2F%2Fwww.canva.com%2Ftemplates%2FEAD29e7aN6g-violet-gradient-blob-zoom-virtual-background%2F"> Canva</a></p>
</article>
<article class="thumb">
<a href="images/This_Is_Fine.webp" class="image"><img src="images/This_Is_Fine.webp" alt="" /></a>
<h2>This is fine</h2>
<p><a href="https://zoommeetingbackgrounds.com/">ZoomMeetingBackgrounds.com </a>offers more than 30 free virtual backgrounds to use on Zoom. They are categorized into memes, funny, movie caps, landscapes and videos.
<a href="images/This_Is_Fine.webp" download="images/This_Is_Fine.webp"></a> Download</p>
</article>
<article class="thumb">
<a href="https://cdn.mos.cms.futurecdn.net/X8vQGd8KuYpU8kQbrsZ4bK-970-80.jpg.webp" class="image"><img src="https://cdn.mos.cms.futurecdn.net/X8vQGd8KuYpU8kQbrsZ4bK-970-80.jpg.webp" alt="" /></a>
<h2>Conference room</h2>
<p>Unsplash is a library of free, high-quality stock images. They offer a range of potential backgrounds, you can appear as if you're in a <a href="https://unsplash.com/photos/eHD8Y1Znfpk/download?force=true">eal conference room.</a>r</p>
</article>
<article class="thumb">
<a href="images/On_the_road.webp" class="image"><img src="images/On_the_road.webp" alt="" /></a>
<h2>On the road</h2>
<p>Unsplash's collection of free Zoom backgrounds also features iconic landmarks and beautiful landscapes, like this one of a road in Iceland. <a href="images/On_the_road.webp" download="images/On_the_road.webp">Download</a> </p>
</article>
<article class="thumb">
<a href="https://cdn.mos.cms.futurecdn.net/AdwCU6BwFanynXGSCRnbCo-970-80.jpg.webp" class="image"><img src="https://cdn.mos.cms.futurecdn.net/AdwCU6BwFanynXGSCRnbCo-970-80.jpg.webp" alt="" /></a>
<h2>Conference Call Bingo</h2>
<p>From <a href="https://www.canva.com/">Canva.com</a></p>
</article>
</div>
<!-- Footer -->
<footer id="footer" class="panel">
<div class="inner split">
<div>
<section>
<h2>Hey there! <img src="https://media.giphy.com/media/hvRJCLFzcasrR4ia7z/giphy.gif" width="25px"></h2>
<p>This a handpicked list of some of the best zoom virtual backgrounds out there, which will make you standout in your zoom calls :P</p>
</section>
<section>
<h2>Follow me @</h2>
<ul class="icons">
<p><li><a href="https://github.com/VinayakBector2002" class="icon brands fa-github"><span class="label">GitHub</span></a><strong> VinayakBector2002</strong></li></p>
<!--
<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
<li><a href="#" class="icon brands fa-dribbble"><span class="label">Dribbble</span></a></li>
<li><a href="#" class="icon brands fa-linkedin-in"><span class="label">LinkedIn</span></a></li>
-->
</ul>
<p>Made by <a href="https://vinayakbector2002.github.io/">Vinayak Bector</a></p>
</section>
<p class="copyright">
©<a href="http://html5up.net">HTML5 UP</a>.
</p>
</div>
<div>
<section>
<h2>Send a submission :D </h2>
<!--
<iframe src="https://docs.google.com/forms/d/e/1FAIpQLScnFMV_1iunZkjioxAgGva8_uVdwUXU9K49_Z9UAlz5SCLtVQ/viewform?embedded=true" width="640" height="942" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe>
-->
<form method="post" action="#">
<div class="fields">
<div class="field half">
<input type="text" name="name" id="name" placeholder="Name" />
</div>
<div class="field half">
<input type="text" name="email" id="email" placeholder="Email" />
</div>
<div class="field">
<textarea name="message" id="message" rows="4" placeholder="Link(s) of the Virtual background(s)"></textarea>
</div>
</div>
<ul class="actions">
<li><input type="submit" value="Send" class="primary" /></li>
<li><input type="reset" value="Reset" /></li>
</ul>
</form>
</section>
</div>
</div>
</footer>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.poptrox.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>