cody
3762 Files
179544 Views
Latest files of cody
def is_prime(n): if n < 2: return False for i in range(2, n//2+1): if not n%i: return F
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia
# Simple Amazon Clone Welcome to my first practice project! This is a basic clone of Amazon created using HTML and CSS. It's a
*{ margin: 0; font-family: Arial, Helvetica, sans-serif; border: border-box; } .navbar { height: 60px; back
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia
*{ padding: 0; margin: 0; } .name{ top: 0; height: 80px; width: 100%; background-color: #615EFC; co
# basic-tribute-satyajit-ray-website # Tribute Website for Satyajit Ray This is a simple tribute website dedicated to the reno
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"
*{ margin: 0; padding: 0; font-family: "Poppins", sans-serif; } .main_box { background: url("photo.png"); he
# mini-project-using-css #Overview This mini project is a simple web page created using HTML and CSS. The project demonstrates
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
body { display: grid; place-items: center; height: 100vh; background: #151515; font-family: "Poppins", sans-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
body { display: grid; place-items: center; height: 100vh; background: #151515; font-family: "Poppins", sans-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>T
body { display: grid; place-items: center; height: 100vh; background: #151515; font-family: "Poppins", sans-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
body { display: grid; place-items: center; height: 100vh; background: #151515; font-family: 'Poppins', sans-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>G
body { display: grid; place-items: center; height: 100vh; background: #151515; font-family: "Poppins", sans-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
html, body { height: 100%; } body { background-color: #151515; color: white; display: grid; place-items: ce
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
* { -webkit-tap-highlight-color: transparent; } *:focus { outline: none; } body { display: grid; place-items:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
html { box-sizing: border-box; } body { display: grid; place-items: center; height: 100vh; background: #121
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
* { transition: 0.25s ease-in-out; box-sizing: border-box; } body { display: grid; place-items: center; hei
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { display: grid; place-items: center; height: 100vh; background: #121314; margin: 0; padding: 0; }
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
* { transition: 0.25s ease-in-out; box-sizing: border-box; } body { display: grid; place-items: center; hei
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
html, body { margin: 0; padding: 0; } body { height: 100vh; display: grid; place-items: center; backgro
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { width: 100%; height: 100vh; overflow: hidden; background: #151515; display: flex; justify-content
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { display: grid; place-items: center; height: 100vh; background: #121314; margin: 0; padding: 0; }
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { background: #121314; height: 100vh; display: grid; place-items: center; } .nav { --color: #ffffff;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { display: grid; place-items: center; height: 100vh; background: #121314; } .hamburger { position: rel
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { display: grid; place-items: center; height: 100vh; background: #121314; margin: 0; padding: 0; }
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
:root { --w: #fafafa; --b: #141414; --s: 1s; --d: calc(var(--s) / 6); } * { box-sizing: border-box; } body
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
:root { box-sizing: border-box; height: 100%; -webkit-font-smoothing: antialiased; background-color: var(--color-root, h
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>A
* { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; ali
$(document).ready(function () { let $canvas = $("#loader canvas"), canvas = $canvas[0], renderer = new THREE
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>I
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
* { box-sizing: border-box; } body { background-color: #111; display: grid; place-items: center; height: 10
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>W
body { background-color: #151515; display: grid; place-items: center; height: 100vh; } .wandering-cubes { w
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
* { box-sizing: border-box; } body { background-color: #111; display: grid; place-items: center; height: 10
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
body { background-color: #333; } .wrapper { display: flex; align-items: center; justify-content: center; po
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
body { background-color: #1d1f20; min-height: 100vh; display: grid; place-content: center; } .folding-cube {
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { background-color: #000; margin: 0; overflow: hidden; }
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --bg: hsl(var(--hue
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>O
body { background: #151515; overflow: hidden; display: grid; place-items: center; height: 100vh; } .wrapper
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
body { background: #1d1d1d; height: 100vh; display: grid; place-items: center; } .pac-man { border-radius:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>I
body { overflow: hidden; margin: 0; background-color: #151515; }
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
* { box-sizing: border-box; } body { display: grid; place-items: center; height: 100vh; background: radial-
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body, html { height: 100%; margin: 0; display: grid; place-items: center; background-color: #000; text-size-adjust:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>3
* { box-sizing: border-box; } body { background-color: #111; display: grid; place-items: center; height: 10
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
* { box-sizing: border-box; } body { background-color: #111; display: grid; place-items: center; height: 10
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>G
body { background-color: #151515; display: grid; place-items: center; height: 100vh; } .ghost { animation:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
* { box-sizing: border-box; } body { background-color: #161622; display: grid; place-items: center; height:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>L
body { height: 100vh; display: grid; place-items: center; background: #151515; } button { height: 60p
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>X
body { background-color: #1a1a1a; } .loader { position: absolute; top: 50%; left: 50%; margin: -90px 0 0 -9
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --bg: hsl(var(--hue), 90%, 90%)
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { box-sizing: border-box; } body { min-height: 100vh; display: grid; place-items: center; background: hsl
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>3
* { box-sizing: border-box; } body { background-color: #1d2630; display: grid; place-items: center; height:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
body { height: 100vh; display: flex; align-items: center; justify-content: center; background: #111; } .spi
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
:root { --duration: 1.5s; --container-size: 250px; --box-size: 33px; --box-border-radius: 15%; } html, body { width:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
* { box-sizing: border-box; } body { background-color: #161622; display: grid; place-items: center; height:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
body { background: #17181c; display: grid; place-items: center; height: 100vh; } .blob-effect { posit
import * as THREE from "https://cdn.skypack.dev/three@0.133.1/build/three.module"; import { OrbitControls } from "https://cdn.sk
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
html, body { padding: 0; margin: 0; overflow: hidden; }
import * as THREE from "three"; import { ParametricGeometry } from "three/addons/geometries/ParametricGeometry.js"; import { Orb
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { overflow: hidden; margin: 0; }
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
body { background: #333; height: 100vh; display: grid; place-items: center; } .load { position: relat
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
body { background: #151515; display: grid; place-items: center; height: 100vh; } #loader { width: 100px;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>O
@keyframes square-animation { 0% { left: 0; top: 0; } 10.5% { left: 0; top: 0;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
body { background-color: #151515; display: grid; place-content: center; min-height: 100vh; } .ripple { widt
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>W
body { background-color: #161622; display: grid; place-items: center; height: 100vh; } .wave { width: 6em;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>N
* { box-sizing: border-box; } html, body { background-color: #000; color: white; } body { min-height: 100vh;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@property --k { syntax: "<number>"; initial-value: 0; inherits: false; } html { height: 100%; } body { background: #0
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
* { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: "Titillium Web", sans-serif; posit
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { margin: 0; min-height: 100vh; display: grid; place-content: center; background: #000; } @property --a { synt
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
* { box-sizing: border-box; } html, body { margin: 0 auto; height: 100%; } body { display: flex; align-ite
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { background-color: #151515; display: grid; place-items: center; height: 100vh; } .mouse-icon { position: relati
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>G
body { background-color: #151515; height: 100vh; margin: 0; overflow: hidden; } @keyframes rotate { from { rotate
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
@import url('https://fonts.googleapis.com/css2?family=Lobster&family=Montserrat:wght@900&display=swap'); body { font-family:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>O
body { margin: 0; min-height: 100vh; display: grid; place-content: center; background: #151515; } img { --s: 300px;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"); html, body {
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import "https://fonts.googleapis.com/css?family=Roboto+Mono:500"; html, body { font-family: "Roboto Mono", monospace; back
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css?family=Open+Sans"); * { box-sizing: border-box; margin: 0; padding: 0; } b
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>E
body { height: 100vh; display: grid; place-items: center; margin: 0; background: linear-gradient(135deg, #295fd5, #9d8
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap"); * { margin: 0; padding: 0; } body {
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@900&display=swap"); body { margin: 0; padding: 0; font
"use strict"; const img_base = "https://threejs.org/examples/textures/kandao3.jpg"; //let img_base = "https://happy358.github.i
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css2?family=Asap&display=swap"); * { margin: 0; padding: 0; } html, body { ove
import { particlesCursor } from "https://unpkg.com/threejs-toys@0.0.8/build/threejs-toys.module.cdn.min.js"; const pc = particl
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
body, html, #app { margin: 0; width: 100%; height: 100%; } #app { overflow: hidden; touch-action: pan-up;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { margin: 0; padding: 0; box-sizing: border-box; } .gallery-track { background: #000; position: fixed; display: g
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap"); :root { --c-aqua: #00FFDF; --c-blue:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
:root { --background: #edeef7; --gray: #edeef7; --white: #ffffff; --poppins: "Poppins", sans-serif; --shadow-opacity:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { margin: 0; padding: 0; box-sizing: border-box; } body { height: 100vh; display: grid; place-items: center; ov
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
body { min-height: 100vh; display: grid; place-items: center; background: #151515; } * { box-sizing: border-box; } .
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
*, *:before, *::after { margin: 0; padding: 0; box-sizing: border-box; } .wrapper { min-height: 100vh; background-col
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { margin: 0; overflow: hidden; } canvas { width: 100%; height: 100% }
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>T
body { background: #151515; height: 100vh; display: grid; place-items: center; } .container { position: rel
import { neonCursor } from "https://unpkg.com/threejs-toys@0.0.8/build/threejs-toys.module.cdn.min.js"; neonCursor({ el: do
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>N
body, html, #neon { margin: 0; width: 100%; height: 100%; } #neon { overflow: hidden; touch-action: pan-up;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;800&display=swap"); :root { --bg: #000000; --clr-1: #0
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
* { margin: 0; padding: 0; box-sizing: border-box; font-family: "Poppins", sans-serif; } body { background-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>W
* { margin: 0; padding: 0; } body { background: #121314; } span { font-size: 200px; position: absolute; top: 30%;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
body { margin: 0; min-height: 100vh; display: grid; place-content: center; background: #151515; } img { --f: 0.1;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
body { margin: 0; background: #000; overflow: hidden; }
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title><
body { height: 100vh; display: grid; place-items: center; font-family: "bebas", sans-serif; background-color
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
:root { --clr-neutral-100: hsl(0, 0%, 100%); --clr-primary-100: hsl(205, 15%, 58%); --clr-primary-400: hsl(215, 25%, 27%);
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>O
html { color-scheme: dark; background: #151515; } h1 { text-align: center; font-size: 16vmin; font-family: system-ui,
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { min-height: 100vh; display: grid; place-items: center; background: #151515; } * { box-sizing: border-box; } .
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>I
@import url("https://fonts.googleapis.com/css2?family=Basic&family=Poppins&display=swap"); :root { --background: #151515; }
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900wght&display=swap"); * { margin:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@400&display=swap"); :root { --x: 50%; --y: 50%; -
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
body { background-color: #151515; display: grid; place-items: center; height: 100vh; } .wrapper a { color:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
@import url("https://fonts.googleapis.com/css?family=Raleway:400,400i,700"); body { display: flex; height: 100vh; j
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap'); * { margin: 0; padding: 0;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap"); * { margin: 0; padding: 0; box-si
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { background: #151515; color: #fff; font-family: "Raleway", sans-serif; } a { color: #fff; text-decoration: none
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>I
body { background: #151515; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow: h
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
@import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap"); * { margin: 0; padding: 0; box-sizing
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css); body { background-color: rgba(
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
*, *::before, *::after { margin: 0; box-sizing: border-box; } html { font-size: 62.5%; } body { display: grid; place
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@property --bg-angle { inherits: false; initial-value: 0deg; syntax: "<angle>"; } * { box-sizing: border-box; } html {
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,700,900"); body { display: grid; place-items: center;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,800'); * { box-sizing: border-box; } body { background
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
body { background: #87aade; display: grid; place-items: center; height: 100vh; } * { box-sizing: bord
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,500,700); html { box-sizing: border-box; height: 100%; }
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
*, *:after, *:before { box-sizing: border-box; } :root { --radius: 8px; --border: 4px; --height: 48px; --speed: 0.25s
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { display: grid; place-items: center; min-height: 100vh; font-size: 2em; background-color: #151515; } .toggle-co
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>L
html, body { margin: 0; padding: 0; width: 100%; height: 100%; background: #151515; } * { box-sizing: b
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>G
body { text-align: center; display: flex; align-items: center; justify-content: center; height: 100vh; b
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>U
@import url('https://fonts.googleapis.com/css?family=Open+Sans:600'); * { margin: 0; padding: 0; } body { height: 100vh;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --input: #ffffff; --primary: #2
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
body { margin: 5% auto 0 auto; width: 90%; max-width: 1125px; background-color: #151515; } input, span, label {
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap"); :root { --primary-color: #fff;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after { bo
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>E
* { box-sizing: border-box; } html, body { height: 100%; } body { display: grid; font-family: Avenir; -web
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body, html { margin: 0; padding: 0; height: 100vh; } body { display: grid; place-items: center; transition: backgro
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --trans-dur: 0.3s; font-size:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { font-size: calc(32px + (40 - 32)*(1
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
:root { --accent: #04da97; --border-width: 3px; --border-radius: 55px; --font-size: 30px; } * { margin: 0; padding:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>M
body { margin: 0; width: 100vw; height: 100vh; display: flex; flex-direction: column; align-items: center; justify
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>T
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --bg: hsl(var(--hue), 10%, 90%)
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,700,900'); body { display: grid; place-items: center;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
body { display: grid; place-items: center; height: 100vh; background: #151515; color: white; font-family
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --bg: hsl(var(--hue), 10%, 90%)
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
@import url(https://fonts.googleapis.com/css?family=Poppins:400,300,500,700); * { margin: 0; padding: 0; box-sizing: bord
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --primary: hsl(var(--hue), 90%,
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
@import url('https://fonts.googleapis.com/css?family=Fira+Mono:700'); body { width: 100vw; height: 100vh; display: grid;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
body { background: #151515; height: 100vh; display: grid; place-items: center; } .input-wrapper label { pos
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>N
:root { --primary-light: #8abdff; --primary: #6d5dfc; --primary-dark: #5b0eeb; --white: #ffffff; --greyLight-1: #e4ebf
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
* { margin: 0; padding: 0; } body { background: #151515; color: #fff; display: grid; place-items: cente
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
* { margin: 0; padding: 0; box-sizing: border-box; } body { background: #151515; color: #fff; display: grid; plac
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
html { height: 100%; } body { margin: 0; padding: 0; font-family: sans-serif; background: linear-gradient(#
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --off-hue: 3; --on-hue1: 123;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>J
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700); * { margin: 0; padding: 0; } ::selection {
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>A
:root { --clr-accent: #0aff11; } input { accent-color: var(--clr-accent); } body { padding: 2rem; background: #061e22;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
*, *:after, *:before { box-sizing: border-box; } body { height: 100vh; display: grid; place-items: center; background
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
:root { --sz: 10vmin; --on: #03a9f4; --of: #fff0; --gr: #666666; --tr: all 0.5s ease 0s; --lg: var(--of); } * { b
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --bg: hsl(var(--hue), 10%, 90%)
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>4
html, body { height: 100%; margin: 0; } html { font-size: 62.5%; } body { font-family: "Lato", sans-serif;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap'); :root { ma
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>4
@import url("https://fonts.googleapis.com/css?family=Fira+Mono:400"); body { width: 100vw; height: 100vh; display:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>N
@import url("https://fonts.googleapis.com/css?family=DM+Sans:500,700&display=swap"); * { box-sizing: border-box; } body {
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css); @import url("https://fonts.googleap
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
@import url("https://fonts.googleapis.com/css?family=Montserrat"); body { background: #333; overflow: hidden; font-
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>M
@import url("https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap"); * { margin: 0;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>M
html { box-sizing: border-box; } *, *:after, *:before { box-sizing: inherit; } html { width: 100%; height: 100
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
html { box-sizing: border-box; } *, *:after, *:before { box-sizing: inherit; } body { background: #2bc8dd; hei
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>M
body { margin: 0; padding: 0; min-height: 100vh; background-color: #222224; font-family: "Open Sans", Verdan
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
* { box-sizing: border-box; } body { background-color: #222224; height: 100vh; width: 100vw; position: rela
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
body { background: #151515; display: flex; align-items: center; flex-direction: column; height: 100vh; } .c
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { margin: 0; padding: 0; box-sizing: border-box; font-family: "Barlow", sans-serif; } .wrapper { posit
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
* { margin: 0; padding: 0; box-sizing: border-box; } body { width: 100%; height: 100vh; background: #67
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
* { padding: 0; margin: 0; } html { height: 100%; } .d-flex { display: flex; } .align-items-center { alig
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
* { margin: 0; padding: 0; } .container { min-height: 100vh; display: grid; place-items: center; scroll
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>H
body { margin: 0; padding: 0; background: #232323; color: #cdcdcd; font-family: "Barlow", sans-serif; } #me
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>D
html, body { width: 100vw; height: 100vh; padding: 0; margin: 0; background-color: #121314; } input { d
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
* { margin: 0; box-sizing: border-box; font-family: HelveticaNeue, Helvetica, sans-serif; } nav { color: white;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>M
@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap"); * { box-sizing: border-box; } body {
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { min-height: 100vh; display
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>J
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap"); body { display: grid; height:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body .darkmode { display: inline-block; font-size: 2rem; padding: 1rem 1rem 0.75rem 1rem; cursor: pointer; } body .darkm
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>D
body { width: 100vw; height: 100vh; display: grid; background: #1e1e24; place-items: center; font-family
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
@import url("https://fonts.googleapis.com/css?family=Rubik:700&display=swap"); * { box-sizing: border-box; } *::before, *:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
body { background: #17181c; display: grid; place-items: center; height: 100vh; } .div-container { position: relative;
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
html { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; box-sizing: border-box; font-size: 62.5%
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>A
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } body { min-height: 100vh; display: grid;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>P
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { min-height: 100vh; display
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
@import url("https://fonts.googleapis.com/css?family=Poppins:700"); *, *:before, *:after { box-sizing: border-box; marg
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
body { display: grid; place-items: center; height: 100vh; background: #222; } .button { --offset: 10p
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>D
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { min-height: 100vh; display
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>O
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { min-height: 100vh; display
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
*, *:before, *:after { box-sizing: border-box; margin: 0; padding: 0; } body { min-height: 100vh; display:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *::before, *::aft
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
body { display: grid; place-items: center; height: 100vh; background: #000; } .btn { background: #49d
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
body { background-color: #121314; display: grid; place-items: center; height: 100vh; } button { outline: no
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap"); * { box-sizing: border-box; m
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>M
body { background: #151515; height: 100vh; display: grid; place-items: center; } .wrapper { width: 200px;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
/*--Global Styles--*/ @import url("https://fonts.googleapis.com/css?family=Fjalla+One"); body { background-color: #222;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
* { border: 0; box-sizing: border-box; margin: 0; padding: 0; } :root { --hue: 223; --bg1: hsl(var(--hu
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>C
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap"); * { margin:
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>A
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } body { min-height: 100vh; display: grid;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>B
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { min-height: 100vh; display
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>D
html { box-sizing: border-box; -webkit-font-smoothing: antialiased; } * { box-sizing: inherit; } *:before, *:after
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
*, *:after, *:before { box-sizing: border-box; } :root { --transition: 0.25s; --spark: 1.8s; } body { --active
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>R
html { box-sizing: border-box; font-size: 62.5%; } html * { box-sizing: inherit; } body { background-color: #1
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>G
body { font-family: 'Montserrat', sans-serif; margin: 0; background: #121314; } .container { display: flex;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>G
*, *:after, *:before { box-sizing: border-box; } :root { --transition: 0.25s; --spark: 1.8s; --hue: 245; } bod
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>E
*, ::before, ::after { margin: 0; padding: 0; box-sizing: border-box; } body { display: grid; place-items:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { height: 100vh; display: grid; place-items: center; background-color: #151515; } button { outline: none; heig
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>N
@charset "UTF-8"; body { font-size: 10px; font-family: Roboto, sans-serif; background-color: #ff7b73; margin: 0
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <ti
body { background-color: #000; display: grid; place-items: center; height: 100vh; } button { position: relative; ou
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>S
* { box-sizing: border-box; } :root { --background-color: #151515; --on-color: #ffc107; --off-color: #666;
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>F
:root { --height: 100px; --width: 200px; } * { margin: 0; padding: 0; box-sizing: border-box; } body {
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>O
body { width: 100vw; height: 100vh; display: grid; background: #1e1e24; place-items: center; } .btn-flip {
# Mini-Projects Mini projects for beginners made using HTML, CSS and JavaScript.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia
/* author: https://codepen.io/RAFA3L/pen/PoVYoPN Rafa */ @import url('https://fonts.cdnfonts.com/css/lcd'); *{ box-sizing:
function updateTimeAndDate() { const now = new Date(); let hours = now.getHours(); const minutes = now.getMinutes().
var inspect = require('../../'); var test = require('tape'); test('dom element', function (t) { t.plan(1); var d = doc
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
[ ["0","\u0000",127], ["a140"," ，、。．‧；：？！︰…‥﹐﹑﹒·﹔﹕﹖﹗｜–︱—︳╴︴﹏（）︵︶｛｝︷︸〔〕︹︺【】︻︼《》︽︾〈〉︿﹀「」﹁﹂『』﹃﹄﹙﹚"], ["a1a1","﹛﹜﹝﹞‘’“”〝〞‵′＃＆＊※§〃○●△
[ ["0","\u0000",127,"€"], ["8140","丂丄丅丆丏丒丗丟丠両丣並丩丮丯丱丳丵丷丼乀乁乂乄乆乊乑乕乗乚乛乢乣乤乥乧乨乪",5,"乲乴",9,"乿",6,"亇亊"], ["8180","亐亖亗亙亜亝亞亣亪亯亰亱亴亶亷亸亹亼亽亾仈仌
[ ["0","\u0000",127], ["8ea1","｡",62], ["a1a1"," 、。，．・：；？！゛゜´｀¨＾￣＿ヽヾゝゞ〃仝々〆〇ー―‐／＼～∥｜…‥‘’“”（）〔〕［］｛｝〈",9,"＋－±×÷＝≠＜＞≦≧∞∴♂♀°′″℃￥＄￠￡％＃
[ ["8740","䏰䰲䘃䖦䕸𧉧䵷䖳𧲱䳢𧳅㮕䜶䝄䱇䱀𤊿𣘗𧍒𦺋𧃒䱗𪍑䝏䗚䲅𧱬䴇䪤䚡𦬣爥𥩔𡩣𣸆𣽡晍囻"], ["8767","綕夝𨮹㷴霴𧯯寛𡵞媤㘥𩺰嫑宷峼杮薓𩥅瑡璝㡵𡵓𣚞𦀡㻬"], ["87a1","𥣞㫵竼龗𤅡𨤍𣇪𠪊𣉞䌊蒄龖鐯䤰蘓墖靊鈘秐稲晠権袝瑌篅枂稬剏遆
{"uChars":[128,165,169,178,184,216,226,235,238,244,248,251,253,258,276,284,300,325,329,334,364,463,465,467,469,471,473,475,477,5
[ ["0","\u0000",128], ["a1","｡",62], ["8140"," 、。，．・：；？！゛゜´｀¨＾￣＿ヽヾゝゞ〃仝々〆〇ー―‐／＼～∥｜…‥‘’“”（）〔〕［］｛｝〈",9,"＋－±×"], ["8180","÷＝≠＜＞≦≧∞∴♂
[ ["0","\u0000",127], ["8141","갂갃갅갆갋",4,"갘갞갟갡갢갣갥",6,"갮갲갳갴"], ["8161","갵갶갷갺갻갽갾갿걁",9,"걌걎",5,"걕"], ["8181","걖걗걙걚걛걝",18,"걲걳걵걶걹걻",4,"
[ ["a140","",62], ["a180","",32], ["a240","",62], ["a280","",32], ["a2ab","",5], ["a2e3","€"], ["a2ef",""], ["a2fd",""
'use strict'; var test = require('tape'); if (typeof Symbol === 'function' && typeof Symbol() === 'symbol') { test('has nativ
'use strict'; var test = require('tape'); if (typeof Symbol === 'function' && typeof Symbol() === 'symbol') { test('has nativ
/*! * body-parser * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module depende
/*! * body-parser * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module depende
/*! * body-parser * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ '
/*! * body-parser * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ '
# ms  Use this package to easily convert various time formats to mil
{ "name": "ms", "version": "2.1.3", "description": "Tiny millisecond conversion utility", "repository": "vercel/ms", "
The MIT License (MIT) Copyright (c) 2020 Vercel, Inc. Permission is hereby granted, free of charge, to any person obtaining a
/** * Helpers. */ var s = 1000; var m = s * 60; var h = m * 60; var d = h * 24; var w = d * 7; var y = d * 365.25; /** * Pa
/*! * depd * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports. * @public
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var inspect = require('../'); var test = require('tape'); var hasToStringTag = require('has-tostringtag/shams')()
var test = require('tape'); var hasSymbols = require('has-symbols/shams')(); var utilInspect = require('../util.inspect'); var r
var test = require('tape'); var forEach = require('for-each'); var inspect = require('../'); test('bad indent options', functi
var test = require('tape'); var inspect = require('../'); var obj = { a: 1, b: [3, 4, undefined, null], c: undefined, d: null }
'use strict'; var inspect = require('../'); var test = require('tape'); var mockProperty = require('mock-property'); test('whe
var test = require('tape'); var v = require('es-value-fixtures'); var forEach = require('for-each'); var inspect = require('../
var inspect = require('../'); var test = require('tape'); test('circular', function (t) { t.plan(2); var obj = { a: 1,
var test = require('tape'); var inspect = require('../'); var xs = ['a', 'b']; xs[5] = 'f'; xs[7] = 'j'; xs[8] = 'k'; test('ho
var inspect = require('../'); var test = require('tape'); test('deep', function (t) { t.plan(4); var obj = [[[[[[500]]]
'use strict'; var test = require('tape'); var hasToStringTag = require('has-tostringtag/shams')(); var inspect = require('../'
'use strict'; var inspect = require('../'); var test = require('tape'); test('quoteStyle option', function (t) { t['throws
var test = require('tape'); var ErrorWithCause = require('error-cause/Error'); var inspect = require('../'); test('type error'
'use strict'; var inspect = require('../'); var test = require('tape'); var mockProperty = require('mock-property'); var hasSym
var inspect = require('../'); var test = require('tape'); test('element', function (t) { t.plan(3); var elem = {
var inspect = require('../'); var test = require('tape'); var arrow = require('make-arrow-function')(); var functionsHaveConfigu
var test = require('tape'); var inspect = require('../'); var obj = { x: 'a\r\nb', y: '\x05! \x1f \x12' }; test('interpolate l
'use strict'; var inspect = require('../'); var test = require('tape'); var hasToStringTag = require('has-tostringtag/shams')()
'use strict'; var inspect = require('../'); var test = require('tape'); var globalThis = require('globalthis')(); test('globa
'use strict'; /* eslint-env browser */ var inspect = require('../'); var d = document.createElement('div'); d.setAttribute('id
'use strict'; var inspect = require('../'); var obj = { a: 1, b: [3, 4] }; obj.c = obj; console.log(inspect(obj));
'use strict'; var inspect = require('../'); var Buffer = require('safer-buffer').Buffer; var holes = ['a', 'b']; holes[4] = 'e
'use strict'; var inspect = require('../'); var obj = [1, 2, function f(n) { return n + 5; }, 4]; console.log(inspect(obj));
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
/** * negotiator * Copyright(c) 2012 Isaac Z. Schlueter * Copyright(c) 2014 Federico Romero * Copyright(c) 2014-2015 Douglas
/** * negotiator * Copyright(c) 2012 Isaac Z. Schlueter * Copyright(c) 2014 Federico Romero * Copyright(c) 2014-2015 Douglas
/** * negotiator * Copyright(c) 2012 Isaac Z. Schlueter * Copyright(c) 2014 Federico Romero * Copyright(c) 2014-2015 Douglas
/** * negotiator * Copyright(c) 2012 Isaac Z. Schlueter * Copyright(c) 2014 Federico Romero * Copyright(c) 2014-2015 Douglas
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */
"use strict"; var Buffer = require("buffer").Buffer, Transform = require("stream").Transform; // == Exports =============
/*--------------------------------------------------------------------------------------------- * Copyright (c) Microsoft Corp
"use strict"; // Some environments don't have global Buffer (e.g. React Native). // Solution would be installing npm modules "b
"use strict"; var Buffer = require("buffer").Buffer; // Note: not polyfilled with safer-buffer on a purpose, as overrides Buffer
"use strict"; var BOMChar = '\uFEFF'; exports.PrependBOM = PrependBOMWrapper function PrependBOMWrapper(encoder, options) {
"use strict"; // Manually added data to be used by sbcs codec in addition to generated one. module.exports = { // Not supp
"use strict"; var Buffer = require("safer-buffer").Buffer; // Note: UTF16-LE (or UCS2) codec is Node.js native. See encodings/i
"use strict"; var Buffer = require("safer-buffer").Buffer; // UTF-7 codec, according to https://tools.ietf.org/html/rfc2152 //
"use strict"; var Buffer = require("safer-buffer").Buffer; // Single-byte codec. Needs a 'chars' string parameter that contains
"use strict"; // Update this array if you add/rename/remove files in this directory. // We support Browserify by skipping autom
"use strict"; // Generated data for sbcs codec. Don't edit manually. Regenerate using generation/gen-sbcs.js script. module.exp
"use strict"; // Description of supported double byte encodings and aliases. // Tables are not require()-d until they are neede
"use strict"; var Buffer = require("safer-buffer").Buffer; // Multibyte codec. In this scheme, a character is represented by 1
"use strict"; var Buffer = require("safer-buffer").Buffer; // Export Node.js internal encodings. module.exports = { // Enc
'use strict' /* eslint-env mocha */ /* eslint no-proto: 0 */ var assert = require('assert') var setPrototypeOf = require('..')
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var hasSymbols = require('../'); var runSymbolTests = require('./tests'); test('inte
'use strict'; // eslint-disable-next-line consistent-return module.exports = function runSymbolTests(t) { t.equal(typeof Symbo
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var callBound = require('../callBound'); test('callBound', function (t) { // stati
'use strict'; var callBind = require('../'); var bind = require('function-bind'); var gOPD = require('gopd'); var hasStrictMode
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var hasProto = require('../'); test('hasProto', function (t) { var result = hasProt
declare module "ipaddr.js" { type IPv4Range = 'unicast' | 'unspecified' | 'broadcast' | 'multicast' | 'linkLocal' | 'loopbac
(function() { var expandIPv6, ipaddr, ipv4Part, ipv4Regexes, ipv6Part, ipv6Regexes, matchCIDR, root, zoneIndex; ipaddr = {}
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var gOPD = require('../'); test('gOPD', function (t) { t.test('supported', { skip:
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&d
'use strict'; var formats = require('./formats'); var has = Object.prototype.hasOwnProperty; var isArray = Array.isArray; var
'use strict'; var utils = require('./utils'); var has = Object.prototype.hasOwnProperty; var isArray = Array.isArray; var def
'use strict'; var getSideChannel = require('side-channel'); var utils = require('./utils'); var formats = require('./formats');
'use strict'; var stringify = require('./stringify'); var parse = require('./parse'); var formats = require('./formats'); modu
'use strict'; var replace = String.prototype.replace; var percentTwenties = /%20/g; var Format = { RFC1738: 'RFC1738',
'use strict'; var test = require('tape'); var inspect = require('object-inspect'); var SaferBuffer = require('safer-buffer').Bu
'use strict'; var test = require('tape'); var qs = require('../'); var utils = require('../lib/utils'); var iconv = require('ic
'use strict'; var test = require('tape'); var qs = require('../'); var utils = require('../lib/utils'); var iconv = require('ic
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var getSideChannel = require('../'); test('export', function (t) { t.equal(typeof
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
# Security Please email [@ljharb](https://github.com/ljharb) or see https://tidelift.com/security if you have a potential secur
// jscs:disable requireUseStrict var test = require('tape'); var functionBind = require('../implementation'); var getCurrentCo
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var GetIntrinsic = require('../'); var test = require('tape'); var forEach = require('for-each'); var debug = re
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var hasPropertyDescriptors = require('../'); var sentinel = {}; test('hasPropertyD
module.exports = inspectorLog; // black hole const nullStream = new (require('stream').Writable)(); nullStream._write = () => {
/** * Module dependencies. */ var tty = require('tty'); var util = require('util'); /** * This is the Node.js implementatio
/** * Detect Electron renderer process, which is node, but we should * treat as a browser. */ if (typeof process !== 'undefi
/** * This is the web browser implementation of `debug()`. * * Expose `debug()` as the module. */ exports = module.exports
/** * This is the common logic for both the Node.js and web browser * implementations of `debug()`. * * Expose `debug()` as
/*! * body-parser * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module depende
/** * Usage: node test.js */ var mime = require('../mime'); var assert = require('assert'); var path = require('path'); // /
#!/usr/bin/env node 'use strict'; const fs = require('fs'); const path = require('path'); const mimeScore = require('mime-scor
# These are supported funding model platforms github: [ljharb] patreon: # Replace with a single Patreon username open_collectiv
'use strict'; var test = require('tape'); var v = require('es-value-fixtures'); var forEach = require('for-each'); var inspect
/* eslint-disable node/no-deprecated-api */ 'use strict' var buffer = require('buffer') var Buffer = buffer.Buffer var safer =
{ "name": "safer-buffer", "version": "2.1.2", "description": "Modern Buffer API polyfill without footguns", "main": "saf
# safer-buffer [![travis][travis-image]][travis-url] [![npm][npm-image]][npm-url] [![javascript style guide][standard-image]][st
/* eslint-disable node/no-deprecated-api */ 'use strict' var test = require('tape') var buffer = require('buffer') var index
# Porting to the Buffer.from/Buffer.alloc API <a id="overview"></a> ## Overview - [Variant 1: Drop support for Node.js ≤ 4.4.x
/* eslint-disable node/no-deprecated-api */ 'use strict' var buffer = require('buffer') var Buffer = buffer.Buffer var safer
# ms [](https://travis-ci.org/zeit/ms) [![Slack Channel](http:/
{ "name": "ms", "version": "2.0.0", "description": "Tiny milisecond conversion utility", "repository": "zeit/ms", "mai
The MIT License (MIT) Copyright (c) 2016 Zeit, Inc. Permission is hereby granted, free of charge, to any person obtaining a co
/** * Helpers. */ var s = 1000; var m = s * 60; var h = m * 60; var d = h * 24; var y = d * 365.25; /** * Parse or format t
1.0.5 / 2023-01-29 ================== * perf: skip value escaping when unnecessary 1.0.4 / 2017-09-11 ==================
{ "name": "content-type", "description": "Create and parse HTTP Content-Type header", "version": "1.0.5", "author": "Dou
/*! * content-type * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * RegExp to match *(
# content-type [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version
{ "name": "set-function-length", "version": "1.1.1", "description": "Set a function's length property", "main": "index.js",
'use strict'; var GetIntrinsic = require('get-intrinsic'); var define = require('define-data-property'); var hasDescriptors = r
# set-function-length <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-ur
'use strict'; var gOPD = require('gopd'); var functionsHaveConfigurableLengths = gOPD && gOPD(function () {}, 'length').config
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
0.2.0 / 2021-05-31 ================== * Use `req.socket` over deprecated `req.connection` 0.1.2 / 2017-09-14 ===============
{ "name": "forwarded", "description": "Parse HTTP X-Forwarded-For header", "version": "0.2.0", "contributors": [ "Do
/*! * forwarded * Copyright(c) 2014-2017 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports.
# forwarded [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-ve
1.6.18 / 2019-04-26 =================== * Fix regression passing request object to `typeis.is` 1.6.17 / 2019-04-25 =========
{ "name": "type-is", "description": "Infer the content-type of a request.", "version": "1.6.18", "contributors": [ "
/*! * type-is * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ 'use
# type-is [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][nod
module.exports = require('util').inspect;
{ "name": "object-inspect", "version": "1.13.1", "description": "string representations of objects in node and the browser
var hasMap = typeof Map === 'function' && Map.prototype; var mapSizeDescriptor = Object.getOwnPropertyDescriptor && hasMap ? Obj
'use strict'; require('core-js'); var inspect = require('./'); var test = require('tape'); test('Maps', function (t) { t.
{ "versions": [ { "version": "*", "target": { "node": "all" }, "response": { "type
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
{ "name": "hasown", "version": "2.0.0", "description": "A robust, ES3 compatible, \"has own property\" predicate.", "main":
declare const _exports: (o: {}, p: PropertyKey) => p is never; export = _exports; //# sourceMappingURL=index.d.ts.map
'use strict'; var call = Function.prototype.call; var $hasOwn = Object.prototype.hasOwnProperty; var bind = require('function-b
{ "compilerOptions": { /* Visit https://aka.ms/tsconfig to read more about this file */ /* Projects */ /* Langua
# hasown <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] [![coverag
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
0.6.3 / 2022-01-22 ================== * Revert "Lazy-load modules from main entry point" 0.6.2 / 2019-04-29 ================
{ "name": "negotiator", "description": "HTTP content negotiation", "version": "0.6.3", "contributors": [ "Douglas Ch
/*! * negotiator * Copyright(c) 2012 Federico Romero * Copyright(c) 2012-2014 Isaac Z. Schlueter * Copyright(c) 2015 Douglas
# negotiator [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-v
{ "name": "bytes", "description": "Utility to parse a string bytes to bytes and vice-versa", "version": "3.1.2", "author
# Bytes utility [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Build Status][ci-ima
/*! * bytes * Copyright(c) 2012-2014 TJ Holowaychuk * Copyright(c) 2015 Jed Watson * MIT Licensed */ 'use strict'; /** *
3.1.2 / 2022-01-27 ================== * Fix return value for un-parsable strings 3.1.1 / 2021-11-15 ================== *
{ "name": "inherits", "description": "Browser-friendly inheritance fully compatible with standard node.js inherits()", "ve
try { var util = require('util'); /* istanbul ignore next */ if (typeof util.inherits !== 'function') throw ''; module.e
Browser-friendly inheritance fully compatible with standard node.js [inherits](http://nodejs.org/api/util.html#util_util_inherit
if (typeof Object.create === 'function') { // implementation from standard node.js 'util' module module.exports = function i
{ "name": "express", "description": "Fast, unopinionated, minimalist web framework", "version": "4.18.2", "author": "TJ
[](http://expressjs.com/) Fast, unopinionated, minimalist web
/*! * express * Copyright(c) 2009-2013 TJ Holowaychuk * Copyright(c) 2013 Roman Shtylman * Copyright(c) 2014-2015 Douglas Ch
4.18.2 / 2022-10-08 =================== * Fix regression routing a large stack in a single route * deps: body-parser@1.20.1
1.0.1 / 2021-11-14 ================== * pref: enable strict mode 1.0.0 / 2018-07-09 ================== * Initial release
{ "name": "toidentifier", "description": "Convert a string of words to a JavaScript identifier", "version": "1.0.1", "au
/*! * toidentifier * Copyright(c) 2016 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports. *
# toidentifier [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Build Status][github-
1.52.0 / 2022-02-21 =================== * Add extensions from IANA for more `image/*` types * Add extension `.asc` to `appl
{ "application/1d-interleaved-parityfec": { "source": "iana" }, "application/3gpdash-qoe-report+xml": { "source":
{ "name": "mime-db", "description": "Media Type Database", "version": "1.52.0", "contributors": [ "Douglas Christoph
/*! * mime-db * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2015-2022 Douglas Christopher Wilson * MIT Licensed */ /**
# mime-db [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][nod
0.5.0 / 2022-04-11 ================== * Add `priority` option * Fix `expires` option to reject invalid dates * pref: impr
# Security Policies and Procedures ## Reporting a Bug The `cookie` team and community take all security bugs seriously. Thank
{ "name": "cookie", "description": "HTTP server cookie parsing and serialization", "version": "0.5.0", "author": "Roman
/*! * cookie * Copyright(c) 2012-2014 Roman Shtylman * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ 'use
# cookie [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][node
1.8.1 / 2017-09-12 ================== * perf: replace regular expression with substring 1.8.0 / 2017-02-18 =================
{ "name": "etag", "description": "Create simple HTTP ETags", "version": "1.8.1", "contributors": [ "Douglas Christop
/*! * etag * Copyright(c) 2014-2016 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports. * @p
# etag [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-version
{ "name": "iconv-lite", "description": "Convert character encodings in pure javascript.", "version": "0.4.24", "
# 0.4.24 / 2018-08-22 * Added MIK encoding (#196, by @Ivan-Kalatchev) # 0.4.23 / 2018-05-07 * Fix deprecation warning in
## Pure JS character encoding conversion [](https:
1.1.2 / 2017-09-23 ================== * perf: improve header token parsing speed 1.1.1 / 2017-03-20 ================== *
{ "name": "vary", "description": "Manipulate the HTTP Vary header", "version": "1.1.2", "author": "Douglas Christopher W
/*! * vary * Copyright(c) 2014-2017 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports. */
# vary [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-version
{ "name": "setprototypeof", "version": "1.2.0", "description": "A small polyfill for Object.setprototypeof", "main": "in
declare function setPrototypeOf(o: any, proto: object | null): any; export = setPrototypeOf;
'use strict' /* eslint no-proto: 0 */ module.exports = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array ? setProtoOf
# Polyfill for `Object.setPrototypeOf` [](https://npmjs.org/pack
0.5.2 / 2017-09-13 ================== * Fix regression matching multiple ETags in `If-None-Match` * perf: improve `If-None-
{ "name": "fresh", "description": "HTTP response freshness testing", "version": "0.5.2", "author": "TJ Holowaychuk <tj@v
/*! * fresh * Copyright(c) 2012 TJ Holowaychuk * Copyright(c) 2016-2017 Douglas Christopher Wilson * MIT Licensed */ 'use
# fresh [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-versio
'use strict'; /* eslint complexity: [2, 18], max-statements: [2, 33] */ module.exports = function hasSymbols() { if (typeof Sy
{ "name": "has-symbols", "version": "1.0.3", "description": "Determine if the JS environment has Symbol support. Supports spe
'use strict'; var origSymbol = typeof Symbol !== 'undefined' && Symbol; var hasSymbolSham = require('./shams'); module.exports
# has-symbols <sup>[![Version Badge][2]][1]</sup> [![github actions][actions-image]][actions-url] [![coverage][codecov-image]][
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
{ "name": "call-bind", "version": "1.0.5", "description": "Robustly `.call.bind()` a function", "main": "index.js", "export
'use strict'; var GetIntrinsic = require('get-intrinsic'); var callBind = require('./'); var $indexOf = callBind(GetIntrinsic
'use strict'; var bind = require('function-bind'); var GetIntrinsic = require('get-intrinsic'); var setFunctionLength = require
# call-bind <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] [![cove
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
1.3.8 / 2022-02-02 ================== * deps: mime-types@~2.1.34 - deps: mime-db@~1.51.0 * deps: negotiator@0.6.3 1.3.
{ "name": "accepts", "description": "Higher-level content negotiation", "version": "1.3.8", "contributors": [ "Dougl
/*! * accepts * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ 'use stric
# accepts [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][nod
0.3.0 / 2014-09-07 ================== * Support Node.js 0.6 * Throw error when parameter format invalid on parse 0.2.0 / 2
{ "name": "media-typer", "description": "Simple RFC 6838 media type parser and formatter", "version": "0.3.0", "author":
/*! * media-typer * Copyright(c) 2014 Douglas Christopher Wilson * MIT Licensed */ /** * RegExp to match *( ";" parameter
# media-typer [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-
2.1.35 / 2022-03-12 =================== * deps: mime-db@1.52.0 - Add extensions from IANA for more `image/*` types -
{ "name": "mime-types", "description": "The ultimate javascript content-type utility.", "version": "2.1.35", "contributo
/*! * mime-types * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ 'use st
# mime-types [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][
{ "name": "destroy", "description": "destroy a stream if possible", "version": "1.2.0", "author": { "name": "Jonatha
/*! * destroy * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2015-2022 Douglas Christopher Wilson * MIT Licensed */ 'use
# destroy [![NPM version][npm-image]][npm-url] [![Build Status][github-actions-ci-image]][github-actions-ci-url] [![Test covera
{ "name": "has-proto", "version": "1.0.1", "description": "Does this environment have the ability to get the [[Prototype]] of
'use strict'; var test = { foo: {} }; var $Object = Object; module.exports = function hasProto() { return { __proto__: test
# has-proto <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] [![cove
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
1.1.2 / 2016-01-17 ================== * perf: enable strict mode 1.1.1 / 2014-12-30 ================== * Improve `browser
{ "name": "methods", "description": "HTTP methods that node supports", "version": "1.1.2", "contributors": [ "Dougla
/*! * methods * Copyright(c) 2013-2014 TJ Holowaychuk * Copyright(c) 2015-2016 Douglas Christopher Wilson * MIT Licensed */
# Methods [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-vers
2.4.1 / 2022-02-22 ================== * Fix error on early async hooks implementations 2.4.0 / 2022-02-21 ==================
{ "name": "on-finished", "description": "Execute a callback when a request closes, finishes, or errors", "version": "2.4.1
/*! * on-finished * Copyright(c) 2013 Jonathan Ong * Copyright(c) 2014 Douglas Christopher Wilson * MIT Licensed */ 'use s
# on-finished [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version]
{ "name": "cookie-signature", "version": "1.0.6", "description": "Sign and unsign cookies", "keywords": ["cookie", "sign
# cookie-signature Sign and unsign cookies. ## Example ```js var cookie = require('cookie-signature'); var val = cookie.s
/** * Module dependencies. */ var crypto = require('crypto'); /** * Sign the given `val` with `secret`. * * @param {Strin
1.0.6 / 2015-02-03 ================== * use `npm test` instead of `make test` to run tests * clearer assertion messages when ch
{ "name": "ee-first", "description": "return the first event in a set of ee/event pairs", "version": "1.1.1", "author":
/*! * ee-first * Copyright(c) 2014 Jonathan Ong * MIT Licensed */ 'use strict' /** * Module exports. * @public */ modu
# EE First [![NPM version][npm-image]][npm-url] [![Build status][travis-image]][travis-url] [![Test coverage][coveralls-image]]
{ "100": "Continue", "101": "Switching Protocols", "102": "Processing", "103": "Early Hints", "200": "OK", "201": "C
2.0.1 / 2021-01-03 ================== * Fix returning values from `Object.prototype` 2.0.0 / 2020-04-19 ==================
{ "name": "statuses", "description": "HTTP status utility", "version": "2.0.1", "contributors": [ "Douglas Christoph
/*! * statuses * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2016 Douglas Christopher Wilson * MIT Licensed */ 'use stri
# statuses [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][no
{ "name": "ipaddr.js", "description": "A library for manipulating IPv4 and IPv6 addresses in JavaScript.", "version": "1.9
(function(){var r,t,n,e,i,o,a,s;t={},s=this,"undefined"!=typeof module&&null!==module&&module.exports?module.exports=t:s.ipaddr=
# ipaddr.js — an IPv6 and IPv4 address manipulation library [](ht
{ "name": "gopd", "version": "1.0.1", "description": "`Object.getOwnPropertyDescriptor`, but accounts for IE's broken impleme
'use strict'; var GetIntrinsic = require('get-intrinsic'); var $gOPD = GetIntrinsic('%Object.getOwnPropertyDescriptor%', true)
# gopd <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] [![coverage]
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
2.5.1 / 2022-02-28 ================== * Fix error on early async hooks implementations 2.5.0 / 2022-02-21 ==================
# Security Policies and Procedures ## Reporting a Bug The `raw-body` team and community take all security bugs seriously. Than
{ "name": "raw-body", "description": "Get and validate the raw body of a readable stream.", "version": "2.5.1", "author"
import { Readable } from 'stream'; declare namespace getRawBody { export type Encoding = string | true; export interface O
/*! * raw-body * Copyright(c) 2013-2014 Jonathan Ong * Copyright(c) 2014-2022 Douglas Christopher Wilson * MIT Licensed */
# raw-body [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-ver
1.15.0 / 2022-03-24 =================== * deps: send@0.18.0 - Fix emitted 416 error missing headers property - Limit
{ "name": "serve-static", "description": "Serve static files", "version": "1.15.0", "author": "Douglas Christopher Wilso
/*! * serve-static * Copyright(c) 2010 Sencha Inc. * Copyright(c) 2011 TJ Holowaychuk * Copyright(c) 2014-2016 Douglas Chris
# serve-static [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Linux Build][gi
BSD 3-Clause License Copyright (c) 2014, Nathan LaFreniere and other [contributors](https://github.com/ljharb/qs/graphs/contrib
{ "name": "qs", "description": "A querystring parser that supports nesting and arrays, with a depth limit", "homepag
# qs <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] [![coverage][c
## **6.11.0 - [New] [Fix] `stringify`: revert 0e903c0; add `commaRoundTrip` option (#442) - [readme] fix version badge ## **6.1
1.0.0 / 2015-06-14 ================== * Initial release
{ "name": "unpipe", "description": "Unpipe a stream from all destinations", "version": "1.0.0", "author": "Douglas Chris
/*! * unpipe * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports. * @publ
# unpipe [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-image
@ECHO off GOTO start :find_dp0 SET dp0=%~dp0 EXIT /b :start SETLOCAL CALL :find_dp0 IF EXIST "%dp0%\node.exe" ( SET "_prog=%d
#!/usr/bin/env pwsh $basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent $exe="" if ($PSVersionTable.PSVersion -lt "6
{ "name": "utils-merge", "version": "1.0.1", "description": "merge() utility function", "keywords": [ "util" ],
/** * Merge object b with object a. * * var a = { foo: 'bar' } * , b = { bar: 'baz' }; * * merge(a, b); *
# utils-merge [](https://www.npmjs.com/package/utils-merg
'use strict' /** * Expose `arrayFlatten`. */ module.exports = arrayFlatten /** * Recursive flatten function with depth. *
{ "name": "array-flatten", "version": "1.1.1", "description": "Flatten an array of nested arrays into a single flat array"
# Array Flatten [![NPM version][npm-image]][npm-url] [![NPM downloads][downloads-image]][downloads-url] [![Build status][travis
{ "name": "side-channel", "version": "1.0.4", "description": "Store information about any JS value in a side channel. Uses We
'use strict'; var GetIntrinsic = require('get-intrinsic'); var callBound = require('call-bind/callBound'); var inspect = requir
# side-channel Store information about any JS value in a side channel. Uses WeakMap if available.
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
'use strict'; /* eslint no-invalid-this: 1 */ var ERROR_MESSAGE = 'Function.prototype.bind called on incompatible '; var toStr
{ "name": "function-bind", "version": "1.1.2", "description": "Implementation of Function.prototype.bind", "keywords": [
'use strict'; var implementation = require('./implementation'); module.exports = Function.prototype.bind || implementation;
# function-bind <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] <!-
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
{ "name": "escape-html", "description": "Escape string for use in HTML", "version": "1.0.3", "license": "MIT", "keywor
# escape-html Escape string for use in HTML ## Example ```js var escape = require('escape-html'); var html = escape('foo &
/*! * escape-html * Copyright(c) 2012-2013 TJ Holowaychuk * Copyright(c) 2015 Andreas Lubbe * Copyright(c) 2015 Tiancheng "T
{ "name": "get-intrinsic", "version": "1.2.2", "description": "Get and robustly cache all JS language-level intrinsics at fir
'use strict'; var undefined; var $SyntaxError = SyntaxError; var $Function = Function; var $TypeError = TypeError; // eslint-
# get-intrinsic <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-url] [![
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
1.2.1 / 2019-05-10 ================== * Improve error when `str` is not a string 1.2.0 / 2016-06-01 ================== *
{ "name": "range-parser", "author": "TJ Holowaychuk <tj@vision-media.ca> (http://tjholowaychuk.com)", "description": "Rang
/*! * range-parser * Copyright(c) 2012-2014 TJ Holowaychuk * Copyright(c) 2015-2016 Douglas Christopher Wilson * MIT License
# range-parser [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version
{ "name": "path-to-regexp", "description": "Express style path to RegExp utility", "version": "0.1.7", "files": [ "i
# Path-to-RegExp Turn an Express-style path string such as `/user/:name` into a regular expression. **Note:** This is a legacy
/** * Expose `pathtoRegexp`. */ module.exports = pathtoRegexp; /** * Match matching groups in a regular expression. */ var
0.1.7 / 2015-07-28 ================== * Fixed regression with escaped round brackets and matching groups. 0.1.6 / 2015-06-19
{ "name": "has-property-descriptors", "version": "1.0.1", "description": "Does the environment have full property descriptor
'use strict'; var GetIntrinsic = require('get-intrinsic'); var $defineProperty = GetIntrinsic('%Object.defineProperty%', true)
# has-property-descriptors <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actio
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
// Karma configuration // Generated on Fri Dec 16 2016 13:09:51 GMT+0000 (UTC) module.exports = function(config) { config.set
module.exports = require('./src/node');
{ "name": "debug", "version": "2.6.9", "repository": { "type": "git", "url": "git://github.com/visionmedia/debug.g
# debug [](https://travis-ci.org/visionmedia/debug) [
{ "name": "debug", "repo": "visionmedia/debug", "description": "small debugging utility", "version": "2.6.9", "keyword
2.6.9 / 2017-09-22 ================== * remove ReDoS regexp in %o formatter (#504) 2.6.8 / 2017-05-18 ==================
1.3.3 / 2019-04-15 ================== * Fix Node.js 0.8 return value inconsistencies 1.3.2 / 2017-09-09 ==================
{ "name": "parseurl", "description": "parse a url with memoization", "version": "1.3.3", "contributors": [ "Douglas
/*! * parseurl * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2014-2017 Douglas Christopher Wilson * MIT Licensed */ 'use
# parseurl [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][no
{ "name": "safe-buffer", "description": "Safer Node.js Buffer API", "version": "5.2.1", "author": { "name": "Feross
declare module "safe-buffer" { export class Buffer { length: number write(string: string, offset?: number, length?: nu
/*! safe-buffer. MIT License. Feross Aboukhadijeh <https://feross.org/opensource> */ /* eslint-disable node/no-deprecated-api */
# safe-buffer [![travis][travis-image]][travis-url] [![npm][npm-image]][npm-url] [![downloads][downloads-image]][downloads-url]
1.20.1 / 2022-10-06 =================== * deps: qs@6.11.0 * perf: remove unnecessary object clone 1.20.0 / 2022-04-02 ====
# Security Policies and Procedures ## Reporting a Bug The Express team and community take all security bugs seriously. Thank y
{ "name": "body-parser", "description": "Node.js body parsing middleware", "version": "1.20.1", "contributors": [ "D
/*! * body-parser * Copyright(c) 2014-2015 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module depende
# body-parser [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Build Status][github-a
0.18.0 / 2022-03-23 =================== * Fix emitted 416 error missing headers property * Limit the headers removed for 30
# Security Policies and Procedures ## Reporting a Bug The `send` team and community take all security bugs seriously. Thank yo
{ "name": "send", "description": "Better streaming static file server with Range and conditional-GET support", "version":
/*! * send * Copyright(c) 2012 TJ Holowaychuk * Copyright(c) 2014-2022 Douglas Christopher Wilson * MIT Licensed */ 'use s
# send [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Linux Build][github-act
{ "author": { "name": "Robert Kieffer", "url": "http://github.com/broofa", "email": "robert@broofa.com" }, "bi
var path = require('path'); var fs = require('fs'); function Mime() { // Map of extension -> mime type this.types = Object.
#!/usr/bin/env node var mime = require('./mime.js'); var file = process.argv[2]; var type = mime.lookup(file); process.stdout.
# mime Comprehensive MIME type mapping API based on mime-db module. ## Install Install with [npm](http://github.com/isaacs/np
{"application/andrew-inset":["ez"],"application/applixware":["aw"],"application/atom+xml":["atom"],"application/atomcat+xml":["a
# Changelog ## v1.6.0 (24/11/2017) *No changelog for this release.* --- ## v2.0.4 (24/11/2017) - [**closed**] Switch to mime-
{ "name": "define-data-property", "version": "1.1.1", "description": "Define a data property on an object. Will fall back to
declare const _exports: (obj: Record<PropertyKey, unknown>, property: PropertyKey, value: unknown, nonEnumerable?: boolean | nul
'use strict'; var hasPropertyDescriptors = require('has-property-descriptors')(); var GetIntrinsic = require('get-intrinsic');
{ "compilerOptions": { /* Visit https://aka.ms/tsconfig to read more about this file */ /* Projects */ /* Langua
# define-data-property <sup>[![Version Badge][npm-version-svg]][package-url]</sup> [![github actions][actions-image]][actions-u
# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](htt
{ "name": "depd", "description": "Deprecate all the things", "version": "2.0.0", "author": "Douglas Christopher Wilson <
# depd [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][node-i
/*! * depd * Copyright(c) 2014-2018 Douglas Christopher Wilson * MIT Licensed */ /** * Module dependencies. */ var relat
2.0.0 / 2018-10-26 ================== * Drop support for Node.js 0.6 * Replace internal `eval` usage with `Function` constr
1.0.2 / 2018-01-21 ================== * Fix encoding `%` as last character 1.0.1 / 2016-06-09 ================== * Fix en
{ "name": "encodeurl", "description": "Encode a URL to a percent-encoded form, excluding already-encoded sequences", "vers
/*! * encodeurl * Copyright(c) 2016 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports. * @p
# encodeurl [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node-ve
2.0.7 / 2021-05-31 ================== * deps: forwarded@0.2.0 - Use `req.socket` over deprecated `req.connection` 2.0.6
{ "name": "proxy-addr", "description": "Determine address of proxied request", "version": "2.0.7", "author": "Douglas Ch
/*! * proxy-addr * Copyright(c) 2014-2016 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module exports.
# proxy-addr [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][npm-url] [![Node.js Version][
1.2.0 / 2022-03-22 ================== * Remove set content headers that break response * deps: on-finished@2.4.1 * deps:
# Security Policies and Procedures ## Reporting a Bug The `finalhandler` team and community take all security bugs seriously.
{ "name": "finalhandler", "description": "Node.js final http responder", "version": "1.2.0", "author": "Douglas Christop
/*! * finalhandler * Copyright(c) 2014-2022 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module depend
# finalhandler [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Version][node
0.5.4 / 2021-12-10 ================== * deps: safe-buffer@5.2.1 0.5.3 / 2018-12-17 ================== * Use `safe-buffer`
{ "name": "content-disposition", "description": "Create and parse Content-Disposition header", "version": "0.5.4", "auth
/*! * content-disposition * Copyright(c) 2014-2017 Douglas Christopher Wilson * MIT Licensed */ 'use strict' /** * Module
# content-disposition [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Node.js Versio
2.0.0 / 2021-12-17 ================== * Drop support for Node.js 0.6 * Remove `I'mateapot` export; use `ImATeapot` instead
{ "name": "http-errors", "description": "Create HTTP error objects", "version": "2.0.0", "author": "Jonathan Ong <me@jon
/*! * http-errors * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2016 Douglas Christopher Wilson * MIT Licensed */ 'use s
# http-errors [![NPM Version][npm-version-image]][npm-url] [![NPM Downloads][npm-downloads-image]][node-url] [![Node.js Version
1.0.1 / 2016-01-17 ================== * perf: enable strict mode 1.0.0 / 2015-03-01 ================== * Add option to on
{ "name": "merge-descriptors", "description": "Merge objects using descriptors", "version": "1.0.1", "author": { "na
/*! * merge-descriptors * Copyright(c) 2014 Jonathan Ong * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */
# Merge Descriptors [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Build Status][tr
const express = require('express'); const path = require('path'); const bodyParser = require('body-parser'); const app = expres
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initi
{ "name": "khushi", "version": "1.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name":
{ "name": "khushi", "version": "1.0.0", "description": "", "main": "server.js", "scripts": { "test": "echo \"Error
# Hotel-Management-Webpage Hotel Booking Webpage: Dive into the world of HTML, CSS, and a touch of JavaScript with this college
const slider = document.querySelector('.slider'); function activate(e) { const items = document.querySelectorAll('.item');
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia
* { margin: 0; padding: 0; box-sizing: border-box; } body { height: 100vh; display: grid; place-i
(()=>{var a=window._flutter;a||(a=window._flutter={});a.loader=null;(function(){"use strict";let l=p(u());function u(){let n=doc
package com.protecgames.tictaktoe import io.flutter.embedding.android.FlutterActivity class MainActivity: FlutterActivity()
<?xml version="1.0" encoding="utf-8"?> <resources> <!-- Theme applied to the Android Window while the process is starting wh
<?xml version="1.0" encoding="utf-8"?> <resources> <!-- Theme applied to the Android Window while the process is starting wh
<?xml version="1.0" encoding="utf-8"?> <!-- Modify this file to customize your launch splash screen --> <layer-list xmlns:androi
<?xml version="1.0" encoding="utf-8"?> <!-- Modify this file to customize your launch splash screen --> <layer-list xmlns:androi
{ "images" : [ { "idiom" : "universal", "filename" : "LaunchImage.png", "scale" : "1x" }, {
# Launch Screen Assets You can customize the launch screen with your own desired assets by replacing the image files in this di
{ "images" : [ { "size" : "20x20", "idiom" : "iphone", "filename" : "Icon-App-20x20@2x.png", "scal
<manifest xmlns:android="http://schemas.android.com/apk/res/android"> <application android:label="Tic Tak Toe"
<manifest xmlns:android="http://schemas.android.com/apk/res/android"> <!-- The INTERNET permission is required for developme
<manifest xmlns:android="http://schemas.android.com/apk/res/android"> <!-- The INTERNET permission is required for developme
{ "images" : [ { "size" : "16x16", "idiom" : "mac", "filename" : "app_icon_16.png", "scale" : "1x"
import Flutter import UIKit import XCTest class RunnerTests: XCTestCase { func testExample() { // If you add code to the
#import "GeneratedPluginRegistrant.h"
import UIKit import Flutter @UIApplicationMain @objc class AppDelegate: FlutterAppDelegate { override func application( _
// // Generated file. Do not edit. // import FlutterMacOS import Foundation import flutter_blue import shared_preferences_fou
import FlutterMacOS import Cocoa import XCTest class RunnerTests: XCTestCase { func testExample() { // If you add code t
import Cocoa import FlutterMacOS class MainFlutterWindow: NSWindow { override func awakeFromNib() { let flutterViewContro
import Cocoa import FlutterMacOS @NSApplicationMain class AppDelegate: FlutterAppDelegate { override func applicationShouldTe
# This file controls Flutter-level build steps. It should not be edited. cmake_minimum_required(VERSION 3.10) set(EPHEMERAL_DIR
// // Generated file. Do not edit. // // clang-format off #ifndef GENERATED_PLUGIN_REGISTRANT_ #define GENERATED_PLUGIN_REGIS
#ifndef RUNNER_FLUTTER_WINDOW_H_ #define RUNNER_FLUTTER_WINDOW_H_ #include <flutter/dart_project.h> #include <flutter/flutter_v
cmake_minimum_required(VERSION 3.14) project(runner LANGUAGES CXX) # Define the application target. To change its name, change
#ifndef RUNNER_UTILS_H_ #define RUNNER_UTILS_H_ #include <string> #include <vector> // Creates a console for the process, and
#include "utils.h" #include <flutter_windows.h> #include <io.h> #include <stdio.h> #include <windows.h> #include <iostream> v
#include "flutter_window.h" #include <optional> #include "flutter/generated_plugin_registrant.h" FlutterWindow::FlutterWindow
#include <flutter/dart_project.h> #include <flutter/flutter_view_controller.h> #include <windows.h> #include "flutter_window.h"
#ifndef RUNNER_WIN32_WINDOW_H_ #define RUNNER_WIN32_WINDOW_H_ #include <windows.h> #include <functional> #include <memory> #in
//{{NO_DEPENDENCIES}} // Microsoft Visual C++ generated include file. // Used by Runner.rc // #define IDI_APP_ICON
#include "win32_window.h" #include <dwmapi.h> #include <flutter_windows.h> #include "resource.h" namespace { /// Window attr
# This file controls Flutter-level build steps. It should not be edited. cmake_minimum_required(VERSION 3.14) set(EPHEMERAL_DIR
// // Generated file. Do not edit. // // clang-format off #ifndef GENERATED_PLUGIN_REGISTRANT_ #define GENERATED_PLUGIN_REGIS
# Project-level configuration. cmake_minimum_required(VERSION 3.10) project(runner LANGUAGES CXX) # The name of the executable
#ifndef FLUTTER_MY_APPLICATION_H_ #define FLUTTER_MY_APPLICATION_H_ #include <gtk/gtk.h> G_DECLARE_FINAL_TYPE(MyApplication, m
<!DOCTYPE html> <html> <head> <!-- If you are serving your web app in a path other than the root, change the href valu
{ "name": "myapp", "short_name": "myapp", "start_url": ".", "display": "standalone", "background_color": "#0175C2", "theme_color
import 'package:flutter/material.dart'; class Multiplayer extends StatelessWidget { @override Widget build(BuildContext con
import 'dart:async'; import 'dart:math' as math; import 'package:flutter/material.dart'; import 'package:shared_preferences/shar
import 'package:flutter/material.dart'; import 'single.dart'; import 'multiplayer.dart'; void main() { runApp(TicTacToeApp())
// This is a basic Flutter widget test. // // To perform an interaction with a widget in your test, use the WidgetTester // util
# Project-level configuration. cmake_minimum_required(VERSION 3.14) project(myapp LANGUAGES CXX) # The name of the executable c
name: tictaktoe description: "A new Flutter project." # The following line prevents the package from being accidentally publishe
{ "version": 2, "builds": [ { "src": "web/", "use": "@vercel/static" } ], "routes": [ { "handle"
# This file configures the analyzer, which statically analyzes Dart code to # check for errors, warnings, and lints. # # The iss
# myapp A new Flutter project. ## Getting Started This project is a starting point for a Flutter application. A few resource
window.addEventListener('load', init); // Globals // Available Levels const levels = { easy: 5, medium: 3, hard: 1 }; /
theme: jekyll-theme-dinky
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s
# WordBeater <h4><p> A Simple speed typing app built with JS XD</p></h4> ## Wanted to have fun? Try it - [WordBeater Game](htt
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initi
* { margin: 0; padding: 0; } body { background: #fff; font-family: Nunito Sans, sans-serif; margin: 0;
from sys import argv from os import system try: import requests except: system("pip install requests") ascii_art
let string = ""; let buttons = document.querySelectorAll(".button"); Array.from(buttons).forEach((button) => { button.addEvent
.head { text-align: center; margin-bottom: 40px; margin-top: 20px; font-family: sans-serif "Roboto"; font-size: 40px;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
* { margin: 0; padding: 0; } .button { padding: 18px; margin: 1px 2px; border: 2px solid black; border-radius: 15px;
console.log("Welcome to Tic Tak Toe"); let turn = "X"; let isgameover = false; // Function to change the trun const changeTurn
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@media screen and (max-width: 500px) { .main { flex-direction: column; align-items: center; height: 50vh; } .m
* { margin: 0; padding: 0; } nav { background-color: black; color: whitesmoke; height: 65%; font-size: 50px; displ
function calculateBMI() { var weight = parseFloat(document.getElementById("Weight").value); var height = parseFloat(document
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
* { margin: 0; padding: 0; box-sizing: border-box; font-family: Arial; transition: all 0.3s; } body { display: flex
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>split</title> </head> <body> <div> <nav> <h1
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>TYPING ProWess</title> <link rel="stylesheet"
<!DOCTYPE html> <html> <head> <title>T Y P I N G ProWess</title> <meta charset="UTF-8"> <meta name="viewport" content="wid
/* CSS code for styling the website */ body { font-family: Arial, sans-serif; margin: 0; padding: 0; background: #603f0
header{ text-align: center; font-family: "Bell MT"; text-decoration: #ec0b0b; } nav li{ float: left; display
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap'); * { margin: 0; pad
<!DOCTYPE html> <html> <head> <title>My Homepage</title> <link rel="stylesheet" href="home_page.css"> </head> <bod
.png){kind=link}
.png){kind=link}
*{ margin: 0px; padding: 0px; font-family: Century; } h1{ text-align: center; margin-top: 1%; margin-bottom:
# Typing_Prowess check your typing speed and accuracy
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="homecss.css"> </head> <body> <header> <div cl
.jpg){kind=link}
.jpg){kind=link}
@import url("https://fonts.googleapis.com/css2?family=Lobster&family=Montserrat:wght@400;600&display=swap"); :root { --primary
const resultElement = document.getElementById("result"); const lengthElement = document.getElementById("length"); const uppercas
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Muli&display=swap"); * { box-sizing: border-box; } body { background-
const labels = document.querySelectorAll(".form-control label"); labels.forEach((label) => { label.innerHTML = label.innerTex
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; } body { font-famil
const draggableList = document.getElementById("draggable-list"); const check = document.getElementById("check"); const richestP
<!-- Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API --> <!DOCTYPE html> <html lang="en">
@import url("https://fonts.googleapis.com/css2?family=Blinker:wght@400;700&display=swap"); :root { --border-color: #e3e5e4;
<!-- Based on Product Landing Page by Brad Traversy (2019) see: https://www.youtube.com/watch?v=61R5kn_kYwY --> <!DOCTYPE html>
@import url("https://fonts.googleapis.com/css2?family=Catamaran:wght@400;700&display=swap"); :root { --primary-color: #333;
const balance = document.getElementById("balance"); const moneyPlus = document.getElementById("money-plus"); const moneyMinus =
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap"); :root { --main-color: #13168d;
const nums = document.querySelectorAll(".nums span"); const counter = document.querySelector(".counter"); const finalMessage = d
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const fill = document.querySelector(".fill"); const empties = document.querySelectorAll(".empty"); const dragStart = function (
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
* { box-sizing: border-box; } body { background-color: steelblue; display: flex; align-items: center; justify-content
const addButton = document.getElementById("add"); const notes = JSON.parse(localStorage.getItem("notes")); const updateLocalSto
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); * { box-sizing: border-box; } bod
const images = document.getElementById("images"); const leftButton = document.getElementById("left"); const rightButton = docume
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const quizData = [ { question: "Which language runs in a web browser?", a: "Java", b: "C", c: "Python", d:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); * { box-sizing: border-box; } bod
const range = document.getElementById("range"); // https://stackoverflow.com/questions/10756313/javascript-jquery-map-a-range-o
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Lato&display=swap"); * { box-sizing: border-box; } body { background
const slider = document.querySelector(".slider-container"), slides = Array.from(document.querySelectorAll(".slide")); let isD
<!-- Based on Build a Touch Slider with HTML, CSS & JavaScript by Brad Traversy (2021) see: https://www.youtube.com/watch?v=5bx
@import url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap"); * { box-sizing: border-box; margin: 0; pa
const ratings = document.querySelectorAll(".rating"); const ratingsContainer = document.querySelector(".ratings-container"); con
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap"); * { box-sizing: border-box; } body { back
const pokeContainer = document.getElementById("poke-container"); const pokemonCount = 150; const colors = { fire: "#FDDFDF",
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Lato:wght@300;400&display=swap"); * { box-sizing: border-box; } body {
<!-- Based on Build A Responsive Website With HTML & CSS Tutorial by Simo Edwin - Dev Ed (2019) see: https://www.youtube.com/wat
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap"); * { box-sizing: border-box; marg
<!-- Based on Learn How To Build A Website In 1 Hour! by Kyle Cook - Web Dev Simplified (2019) see: https://www.youtube.com/watc
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap"); * { box-sizing: border-box; }
const boxes = document.querySelectorAll(".box"); const checkBoxes = () => { const triggerBottom = (window.innerHeight / 5) *
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const container = document.getElementById("container"); const text = document.getElementById("text"); // The 4-7-8 breathing te
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Montserrat&display=swap"); :root { --background-color: #046973; --larg
const modal = document.querySelector(".modal"); const previews = document.querySelectorAll(".gallery img"); const original = doc
<!-- Based on Fluid Image Pop Up JavaScript Tutorial by Simo Edwin - Dev Ed (2020) see: https://www.youtube.com/watch?v=4SQXOA8Z
@import url("https://fonts.googleapis.com/css2?family=Sacramento&display=swap"); * { box-sizing: border-box; margin: 0; p
const panels = document.querySelectorAll(".panel"); panels.forEach((panel) => { panel.addEventListener("click", () => { r
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; /* to avoid width prob
const KEY = "3fd2be6f0c70a2a598f084ddfb75487c"; // For educational purposes only - DO NOT USE in production // Request your own
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); :root { --primary-color: #22254b;
const main = document.getElementById("main"); const addUserButton = document.getElementById("add-user"); const doubleButton = do
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const postsContainer = document.getElementById("posts-container"); const loading = document.getElementById("loader"); const filt
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); :root { --main-color: #9cd4fa; --
<!-- Based on CSS Loaders Tutorial by Shaun Pelling - The Net Ninja (2020) see: https://www.youtube.com/watch?v=GFkorypkXsQ&list
* { box-sizing: border-box; } body { background-color: #fef9f2; display: flex; align-items: center; justify-content:
<!-- Based on Creating a Magazine Layout with CSS by Kevin Powell (2021) see: https://www.youtube.com/watch?v=QJz81yva7r0 --> <
@import url("https://fonts.googleapis.com/css2?family=Heebo:wght@100..900&family=Oswald:wght@300..700&&display=swap"); *, *::be
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
* { box-sizing: border-box; } body { background-color: #2c3e50; display: flex; align-items: center; justify-content:
const main = document.querySelector("main"); const voicesSelect = document.getElementById("voices"); const textarea = document.g
<!-- Reference: https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis --> <!DOCTYPE html> <html lang="en"> <head>
@import url("https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&display=swap"); :root { --main-color:
const openButton = document.querySelector(".open-btn"); const closeButton = document.querySelector(".close-btn"); const navs = d
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; } body { font-famil
const modal = document.querySelector(".modal"); const loginButton = document.querySelector(".login-btn"); const closeButton = do
<!-- Based on Hulu Webpage Clone | HTML & CSS by Brad Traversy (2021) see: https://www.youtube.com/watch?v=9OVLaEjY-Rc --> <!DO
@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;700&display=swap"); * { box-sizing: border-box; ma
const toggle = document.getElementById("toggle"); const nav = document.getElementById("nav"); toggle.addEventListener("click",
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; } body { background
const open = document.getElementById("open"); const close = document.getElementById("close"); const container = document.querySe
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap"); * { box-sizing: border-box; } body {
<!-- Based on Build a Responsive Website by Brad Traversy (2020) see: https://www.youtube.com/watch?v=p0bGHP-PXD4 --> <!DOCTYPE
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap"); :root { --primary-color: #047aed; --sec
.container { max-width: 1100px; margin: 0 auto; padding: 0 40px; } .flex { display: flex; justify-content: center;
const smallCups = document.querySelectorAll(".cup-small"); const liters = document.getElementById("liters"); const percentage =
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap"); :root { --border-color: #144fc6
const slides = document.querySelectorAll(".slide"); const nextButton = document.getElementById("next"); const prevButton = docum
<!-- Based on Full Screen Responsive Image Slider by Brad Traversy (2019) see: https://www.youtube.com/watch?v=wWWNrANNO1k -->
@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@400;700&display=swap"); * { box-sizing: border-box; margi
const textElement = document.getElementById("text"); const speedElement = document.getElementById("speed"); const text = "We Lov
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const signUpButton = document.getElementById("signUp"); const signInButton = document.getElementById("signIn"); const container
<!-- Based on Sliding Sign In & Sign Up Form by Brad Traversy (2019) see: https://www.youtube.com/watch?v=mUdo6w87rh4 --> <!DOC
@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;800&display=swap"); :root { --main-color: #6dd5ed; --
const form = document.getElementById("form"); const username = document.getElementById("username"); const email = document.getEl
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Open+Sans&display=swap"); :root { --main-color: #3498db; --success-col
<!-- Based on Fun ways to animate CSS gradients by Kevin Powell (2019) see: https://www.youtube.com/watch?v=f3mwKLXpOLk --> <!D
@import url("https://fonts.googleapis.com/css2?family=Bungee&display=swap"); :root { --gradient: linear-gradient(90deg, #7f7f
const rulesButton = document.getElementById("rules-btn"); const closeButton = document.getElementById("close-btn"); const rules
<!-- References: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API --> <!-- https://developer.mozilla.org/en-US/docs/W
@import url("https://fonts.googleapis.com/css2?family=Balsamiq+Sans:wght@400;700&display=swap"); :root { --background-color:
const tagsElements = document.getElementById("tags"); const textarea = document.getElementById("textarea"); const createTags =
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; } body { background
const form = document.getElementById("form"); const search = document.getElementById("search"); const result = document.getEleme
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;700&display=swap'); :root { --main-color: #3B9B76; --s
<!-- Build Glass Website with HTML and CSS Tutorial by Simo Edwin - Dev Ed (2021) see: https://www.youtube.com/watch?v=O7WbVj5ap
* { margin: 0; padding: 0; box-sizing: border-box; --main-bg-color: #65dfc9; --secondary-bg-color: #6cdbeb; } .conten
const container = document.querySelector(".container"); const slider = document.querySelector(".slider"); const before = documen
<!-- Awesome Vanilla Javascript Image Slider! by Simo Edwin - Dev Ed (2021) see: https://www.youtube.com/watch?v=ee8y1IV6pOI -->
* { box-sizing: border-box; margin: 0; padding: 0; } body { background-color: #fef9f2; display: flex; align-items:
const counters = document.querySelectorAll(".counter"); counters.forEach((counter) => { counter.innerText = "0"; const upda
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap"); * { box-sizing: border-box; } body { bac
const toggleButton = document.querySelector(".toggle"); const navigation = document.querySelector(".navigation"); toggleButton.
<!-- Based on Creative Agency Website From Scratch by Brad Traversy (2021) see: https://www.youtube.com/watch?v=lvYnfMOUOJY -->
@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@300;500;700&display=swap"); :root { --main-color: #f60f20;
const word = document.getElementById("word"); const text = document.getElementById("text"); const scoreElement = document.getEle
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url('https://fonts.googleapis.com/css2?family=Syne+Mono&display=swap'); :root { --primary-color: #BBE0EF; --seconda
const insert = document.getElementById("insert"); window.addEventListener("keydown", (event) => { insert.innerHTML = ` <d
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; } body { background
const jokeEl = document.getElementById("joke"); const jokeBtn = document.getElementById("jokeBtn"); const generateJoke = async
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const container = document.querySelector(".container"); const seats = document.querySelectorAll(".row .seat:not(.occupied)"); co
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Poppins&display=swap"); * { box-sizing: border-box; } body { backgrou
const musicContainer = document.getElementById("music-container"); const playButton = document.getElementById("play"); const pre
<!-- Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio --> <!DOCTYPE html> <html lang="en"> <head>
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;700&display=swap'); * { box-sizing: border-box; } body
// Ref: https://developer.mozilla.org/fr/docs/Web/API/Canvas_API const canvas = document.getElementById("canvas"); const increas
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
let rellax = new Rellax(".rellax");
<!-- Based on Parallax Landing Page - Rellax.js by Brad Traversy (2020) see: https://www.youtube.com/watch?v=aAxt0Z7IXIo --> <!
@import url("https://fonts.googleapis.com/css2?family=Nixie+One&display=swap"); :root { --primary-color: #2d2254; --seconda
const loveMe = document.querySelector(".loveMe"); const times = document.querySelector("#times"); let clickTime = 0; let timesC
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Oswald&display=swap"); * { box-sizing: border-box; } body { font-fam
<!-- Based on Chat Interface by Florin Pop (2019) see: https://www.florin-pop.com/blog/2019/04/chat-interface/ --> <!DOCTYPE ht
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap"); * { box-sizing: border-box; } body {
const boxesContainer = document.getElementById("boxes"); const button = document.getElementById("btn"); const createBoxes = ()
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap"); * { box-sizing: border-box; } body { backgro
const menuToggle = document.querySelector(".toggle"); const showcase = document.querySelector(".showcase"); menuToggle.addEvent
<!-- Based on Create a Website With Video Background | HTML & CSS by Brad Traversy (2021) see: https://www.youtube.com/watch?v=8
@import url("https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap"); :root { --overla
<!-- Based on Pure CSS Tooltip by Florin Pop (2019) see: https://www.florin-pop.com/blog/2019/05/pure-css-tooltip/ --> <!DOCTYP
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const result = document.getElementById("result"); const filter = document.getElementById("filter"); const listItems = []; const
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const contents = document.querySelectorAll(".content"); const listItems = document.querySelectorAll("nav ul li"); const hideAll
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Open+Sans&display=swap"); * { box-sizing: border-box; } body { backgr
const codes = document.querySelectorAll(".code"); codes[0].focus(); codes.forEach((code, index) => { code.addEventListener("
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli:wght@300;700&display=swap"); * { box-sizing: border-box; } body {
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const days = document.getElementById("days"); const hours = document.getElementById("hours"); const minutes = document.getElemen
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url('https://fonts.googleapis.com/css2?family=PT+Sans+Narrow:wght@400;700&display=swap'); * { box-sizing: border-box;
const password = document.getElementById("password"); const background = document.getElementById("background"); password.addEve
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
* { box-sizing: border-box; } body { display: flex; flex-direction: column; align-items: center; justify-content: cen
<!-- Based on Mobile-First Responsive Build (with CSS Grid) by Shaun Pelling - The Net Ninja (2020) see: https://www.youtube.com
@import url("https://fonts.googleapis.com/css2?family=Rubik&display=swap"); /* variables */ :root { --primary: #22d0ff; --s
const rellax = new Rellax(".rellax", { speed: -2, center: false, wrapper: null, round: true, vertical: true, horizon
<!-- Here's 1 Trick to EASILY Make An Awesome Looking Website by Gary Simon - DesignCourse (2021) see: https://www.youtube.com/w
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap"); * { box-sizing: border-box; } bod
const button = document.getElementById("button"); const toasts = document.getElementById("toasts"); const messages = [ "Messa
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); * { box-sizing: border-box; } bod
const wordElement = document.getElementById("word"); const wrongLettersElement = document.getElementById("wrong-letters"); const
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=DotGothic16&display=swap"); :root { --primary-color: #1f2f61; --secon
const APIURL = "https://api.github.com/users/"; const form = document.getElementById("form"); const main = document.getElementBy
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); * { box-sizing: border-box; } bod
<!-- Based on Build One Color UI Responsive Website by Simo Edwin - Dev Ed (2020) see: https://www.youtube.com/watch?v=2IjyqauKu
<!-- Based on CSS Grid Layout With Image Span by Brad Traversy (2020) see: https://www.youtube.com/watch?v=-qOe8lBAChE --> <!DO
@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@300;400&display=swap"); :root { --main-color: #42515c; --
<!-- Based on Build a Modern Landing Page Website by Kevin Powell for Traversy Media (2020) see: https://www.youtube.com/watch?v
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;700&display=swap"); *, *::before, *::after { box-
const loadText = document.querySelector(".loading-text"); const bg = document.querySelector(".bg"); let load = 0; const blurri
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Ubuntu&display=swap"); * { box-sizing: border-box; } body { font-fam
const nav = document.querySelector(".nav"); const fixNav = () => { if (window.scrollY > nav.offsetHeight + 150) nav.classList
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Open+Sans&display=swap"); * { box-sizing: border-box; margin: 0; pad
const toggles = document.querySelectorAll(".faq-toggle"); toggles.forEach((toggle) => { toggle.addEventListener("click", () =
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); * { box-sizing: border-box; } body { font-famil
const sliderContainer = document.querySelector(".slider-container"); const slideRight = document.querySelector(".right-slide");
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width
@import url("https://fonts.googleapis.com/css?family=Open+Sans&display=swap"); * { box-sizing: border-box; margin: 0; pad
const messageElement = document.getElementById("msg"); const randomNumber = getRandomNumber(); window.SpeechRecognition = wi
<!-- Reference: https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition --> <!DOCTYPE html> <html lang="en"> <head
@import url("https://fonts.googleapis.com/css2?family=Recursive:wght@400;700&display=swap"); * { box-sizing: border-box; } b
const testimonialsContainer = document.querySelector(".testimonials-container"); const testimonial = document.querySelector(".te
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap"); * { box-sizing: border-box; } body { back
const body = document.body; const slides = document.querySelectorAll(".slide"); const leftButton = document.getElementById("left
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
<!-- Based on Learn To Build An SVG Animation With CSS by Simo Edwin - Dev Ed (2019) see: https://www.youtube.com/watch?v=gWai7f
* { box-sizing: border-box; margin: 0; padding: 0; } body { display: flex; flex-direction: column; align-items: cen
let controller = new ScrollMagic.Controller(); let timeline = new TimelineMax(); timeline .to(".rock", 10, { y: -300 }) .to
<!-- Build Parallax Website With HTML CSS & Javascript by Simo Edwin - Dev Ed (2021) see: https://www.youtube.com/watch?v=Nt70Ld
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap"); * { box-sizing: border-box; marg
const about = document.querySelector("#about"); const contact = document.querySelector("#contact"); const aboutContent = documen
<!-- Based on Terminal Style Landing Page | WinBox.js by Brad Traversy (2021) see: https://www.youtube.com/watch?v=jQCk2yo10YY -
@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@300;400;700&display=swap"); * { box-sizing: border-box
const form = document.getElementById("form"); const input = document.getElementById("input"); const todosList = document.getElem
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); * { box-sizing: border-box; } bod
const toggles = document.querySelectorAll(".toggle"); const good = document.getElementById("good"); const cheap = document.getEl
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const search = document.querySelector(".search"); const btn = document.querySelector(".btn"); const input = document.querySelect
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
// Movement Animation to happen const card = document.querySelector(".card"); const container = document.querySelector(".contain
<!-- Awesome 3D ANIMATION Javascript Tutorial! by Simo Edwin - Dev Ed (2020) see: https://www.youtube.com/watch?v=XK7T3mY1V-w --
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap"); * { box-sizing: border-box; marg
const buttons = document.querySelectorAll(".ripple"); buttons.forEach((button) => { button.addEventListener("click", function
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const left = document.querySelector(".left"); const right = document.querySelector(".right"); const container = document.querySe
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); :root { --left-bg-color: rgba(87, 8
const sounds = ["applause", "boo", "gasp", "tada", "victory", "wrong"]; const buttons = document.getElementById("buttons"); con
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap"); * { box-sizing: border-box; } bod
const toggle = document.getElementById("toggle"); const open = document.getElementById("open"); const close = document.getElemen
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Lato&display=swap"); :root { --modal-duration: 1s; --primary-color: #1
const search = document.getElementById("search"); const submit = document.getElementById("submit"); const random = document.getE
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Akaya+Telivigala&display=swap"); :root { --main-color: #e4e0ef; --lig
const header = document.getElementById("header"); const title = document.getElementById("title"); const excerpt = document.getEl
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const hourElement = document.querySelector(".hour"); const minuteElement = document.querySelector(".minute"); const secondElemen
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Heebo:300&display=swap"); * { box-sizing: border-box; } :root { --pri
const screens = document.querySelectorAll(".screen"); const chooseInsectButtons = document.querySelectorAll(".choose-insect-btn"
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap"); * { box-sizing: border-box; } body { b
const cardsContainer = document.getElementById("cards-container"); const prevButton = document.getElementById("prev"); const nex
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;700&display=swap"); :root { --primary-color: #8e44
// Reference: https://developer.mozilla.org/fr/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs const video = do
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css?family=Muli&display=swap"); * { box-sizing: border-box; } body { font-family
const currencyOne = document.getElementById("currency-one"); const amountOne = document.getElementById("amount-one"); const curr
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); :root { --primary-color: #fd5900; }
function init() { // slider const slides = document.querySelectorAll(".slide"); const pages = document.querySelectorAll(".
<!-- Based on Design & Build A Website Crash Course by Simo Edwin - Dev Ed (2019) see: https://www.youtube.com/watch?v=EwmvBnR_x
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500&display=swap"); :root { --white: rgba(255, 255
const container = document.getElementById("container"); const colors = ["#056CF2", "#05AFF2", "#F2E205", "#F28705", "#A62103"];
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
* { box-sizing: border-box; } body { background-color: #111; display: flex; align-items: center; justify-content: cen
const present = document.getElementById("present"); const options = { colors: [ "#34D963", "#068C2C", "#FF5757",
<!-- Based on Build a CSS Christmas Present that Opens & Closes by Shaun Pelling - The Net Ninja (2020) see: https://www.youtube
@import url("https://fonts.googleapis.com/css2?family=Itim&display=swap"); * { box-sizing: border-box; } body { background
const container = document.querySelector(".container"); const unsplashURL = "https://source.unsplash.com/random/"; const rows =
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"); * { box-sizing: border-box; } body
const progress = document.getElementById("progress"); const prev = document.getElementById("prev"); const next = document.getEle
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, in
@import url("https://fonts.googleapis.com/css2?family=Muli&display=swap"); :root { --line-border-fill: #3498db; --line-bord
# 100 Projects In 100 Days - HTML, CSS & JavaScript 100+ mini web projects using HTML, CSS and JavaScript. [See all projects o
{ "title": "Hollywood Hit songs", "description": "Songs for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Romantic songs for you", "description": "Love in Ground" }
{ "title": "Sleep songs of 2023", "description": "Sleep songs for you" }
{ "title": "Diljit Dosanjh New Songs", "description": "Diljit Dosanjh hits" }
{ "title": "Karan Aujla Hit Songs", "description": "Karan Aujla for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Angry Mood Songs", "description": "Calm your Anger now" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Get up and Grind", "description": "You can do it!" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Mega Hits Songs", "description": "Mega Hit Songs for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Just Chill song by Jerry ", "description": "Yes, Just Chill " }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Dark Horse / Strength", "description": "Dark Songs for you" }
{ "title": "bollywood Hit Songs", "description": "bollywood Songs for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Go Funky let's Go", "description": "Lets go Funky" }
{ "title": "Hollywood Hit songs", "description": "Songs for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Romantic songs for you", "description": "Love in Ground" }
{ "title": "Sleep songs of 2023", "description": "Sleep songs for you" }
{ "title": "Diljit Dosanjh New Songs", "description": "Diljit Dosanjh hits" }
{ "title": "Karan Aujla Hit Songs", "description": "Karan Aujla for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Angry Mood Songs", "description": "Calm your Anger now" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Get up and Grind", "description": "You can do it!" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Mega Hits Songs", "description": "Mega Hit Songs for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Just Chill song by Jerry ", "description": "Yes, Just Chill " }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Dark Horse / Strength", "description": "Dark Songs for you" }
{ "title": "bollywood Hit Songs", "description": "bollywood Songs for you" }
/cover.jpg){kind=link}
/cover.jpg){kind=link}
{ "title": "Go Funky let's Go", "description": "Lets go Funky" }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>login</title> <script type="module" src="https://un
* { font-family: "Poppins"; } body { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>login</title> <script type="module" src="https://un
* { font-family: "Poppins"; } body { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
let currentSong = new Audio(); let currFolder; let songs; function secondsToMinutesSeconds(seconds) { if (isNaN(seconds) |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,
:root { --a: 0; } .logo img { width: 80px; } * { margin: 0; padding: 0; box-sizing: border-box; font-w
.border { border: 2px solid red; margin: 3px; } .invert { filter: invert(1); } .flex { display: flex;
let currentSong = new Audio(); let currFolder; let songs; function secondsToMinutesSeconds(seconds) { if (isNaN(seconds) |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initi
:root { --a: 0; } .logo img { width: 80px; } * { margin: 0; padding: 0; box-sizing: border-box; font-w
.border { border: 2px solid red; margin: 3px; } .invert { filter: invert(1); } .flex { display: flex;
# spotify-clone spotify-clone-response
// retrieve the data // used https://api.jquery.com/jquery.getjson/ as a resource $.getJSON("data.json", function(data) {
@import url('https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,10
<html> <head> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-FJVEN7W1
// https://api.github.com/users/ABHCH const searchInput = document.querySelector(".user_name"); const userImage = document.q
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@500;700&display=swap'); @import url('https://fonts.googleapis
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
class Knight extends Piece { constructor(position, name) { super(position, 'knight', name); } getAllowedMoves() { const
class Bishop extends Piece { constructor(position, name) { super(position, 'bishop', name); } getAllowedMoves() { return
class King extends Piece { constructor(position, name) { super(position, 'king', name); this.ableToCastle = true; } get
class Rook extends Piece { constructor(position, name) { super(position, 'rook', name); this.ableToCastle = true; } chan
class Piece { constructor(position, rank, name) { this.position = position; this.rank = rank; this.name = name;
class Queen extends Piece { constructor(position, name) { super(position, 'queen', name); } getAllowedMoves(){ return [
class Pawn extends Piece { constructor(position, name) { super(position, 'pawn', name) } getAllowedMoves() { const posi
class Game { constructor(pieces) { this.pieces = pieces; this.turn = 'white'; this.clickedPiece = null; this._event
*{ margin: 0; padding: 0; } body{ background: #ddd; } #board{ width: 600px; height: 600px; border:3px #333 solid; } #board
<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="chess.css"> </head> <body> <div id
const startBoard = game => { const board = document.getElementById('board'); const squares = board.querySelectorAll('.
# Js-Chess Welcome to Js-Chess, a customizable and visually appealing chess game implemented in JavaScript. This project feat
<p onclick="change()">Hello World!!</p> <script> function change(){ document.querySelector("p").innerHTML = "Hello JavaSc
burger = document.querySelector(".burger") navbar = document.querySelector(".nav-bar") navRight = document.querySelector(".nav
<div class="nav-bar h-nav-resp"> <div class="nav-left v-resp"> <h3 class="logo">PaathShala</h3> <nav class="nav-
body{ box-sizing: border-box; margin: 0; padding: 0; } .main{ background: linear-gradient(rgba(0,0,0, 0.5)
<html> <head> <meta http-equiv=Content-Type content="text/html; charset=utf-8"> <meta name=Generator content="Microsoft Wor
/*! @license DOMPurify 3.0.5 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public Lice
/*! @license DOMPurify 3.0.5 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public Lice
