A Pen by Nick Colley

Developer

Size

18,585 Kb

Views

6,072

A Pen by Nick Colley Previews
A Pen by Nick Colley HTML Codes
A Pen by Nick Colley CSS Codes

How do I make an a pen by nick colley?

What is a a pen by nick colley? How do you make a a pen by nick colley? This script and codes were developed by Nick Colley on 12 November 2022, Saturday.

A Pen by Nick Colley Previews

A Pen by Nick Colley - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Nick Colley</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ .absolute-center,
.envelope,
.envelope-top,
.card { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;
}
.anim-card { transition: transform 1s 1s; transform: translateY(-30%); animation: slide-up 10s 1s;
}
@keyframes slide-up { 0% { z-index: 2; } 100% { z-index: 2; }
}
.anim-explosion { animation: explosion 2s 1s infinite alternate;
}
@keyframes explosion { 50% { opacity: 1; } 100% { opacity: 1; transform: rotate(25deg); }
}
* { box-sizing: border-box;
}
body { overflow: hidden; background-color: #556; background-image: radial-gradient(#334, #556);
}
.envelope,
.envelope-top { height: 0; width: 0; border: 100px solid #ccc; border-top-width: 80px; border-bottom-width: 50px; border-bottom-color: #d1d1d1;
}
.envelope { z-index: 3; border-top-color: transparent;
}
.envelope:hover ~ .envelope-top { transform: rotateX(180deg);
}
.envelope:hover ~ .card { transition: transform 1s 1s; transform: translateY(-30%); animation: slide-up 10s 1s;
}
.envelope:hover ~ .confetti,
.envelope:hover ~ .confetti:after,
.envelope:hover ~ .confetti:before { animation: explosion 2s 1s infinite alternate;
}
.envelope-top { z-index: 2; border-color: transparent; border-top-color: #d1d1d1; background: none; transform-origin: top; transition: transform 1s; pointer-events: none;
}
.card { z-index: 1; height: 130px; width: 200px; background-color: #e6e6e6; text-align: center; color: orangered; font-weight: bolder; padding-top: 43.33333333px;
}
.confetti { opacity: 0;
}
.confetti,
.confetti:after,
.confetti:before { top: 0; left: 0; position: absolute; content: ''; width: 10px; height: 10px; color: red; font-size: 1.5em;
}
.confetti:after,
.confetti:after:after,
.confetti:before:after { color: blue;
}
.confetti:before,
.confetti:after:before,
.confetti:before:before { color: purple;
}
.confetti:after { content: '\01F63C'; margin: 45px;
}
.confetti:before { content: '\01F63D'; margin: -45px;
}
.confetti:nth-child(100) { top: 10.28105092%; left: 71.28205907%; color: #abc7bd;
}
.confetti:nth-child(100):after { top: 29.93617865%; left: 7.14057701%; color: #c2a4b9;
}
.confetti:nth-child(100):before { top: 85.21504098%; left: 28.21575573%; color: #eab9ef;
}
.confetti:nth-child(99) { top: 81.9389468%; left: 23.39336235%; color: #d3ddf2;
}
.confetti:nth-child(99):after { top: 60.30566103%; left: 36.68657103%; color: #d99fa0;
}
.confetti:nth-child(99):before { top: 67.28008218%; left: 21.08519616%; color: #9cd8ff;
}
.confetti:nth-child(98) { top: 64.12047605%; left: 62.89515289%; color: #fbe4f2;
}
.confetti:nth-child(98):after { top: 70.05192494%; left: 81.39296128%; color: #e9b69d;
}
.confetti:nth-child(98):before { top: 49.07243791%; left: 66.52248623%; color: #e7f3df;
}
.confetti:nth-child(97) { top: 52.89930458%; left: 46.49825499%; color: #9aa1f5;
}
.confetti:nth-child(97):after { top: 73.5551788%; left: 65.96278352%; color: #d5b0f0;
}
.confetti:nth-child(97):before { top: 5.27194571%; left: 11.62122064%; color: #9ba0f9;
}
.confetti:nth-child(96) { top: 3.10555019%; left: 5.77397643%; color: #d5abcd;
}
.confetti:nth-child(96):after { top: 11.06194247%; left: 18.24363122%; color: #ddfdde;
}
.confetti:nth-child(96):before { top: 51.45592449%; left: 45.84444726%; color: #9eb9a9;
}
.confetti:nth-child(95) { top: 1.59000064%; left: 39.54835928%; color: #eab697;
}
.confetti:nth-child(95):after { top: 54.25144034%; left: 16.68766826%; color: #a09ccc;
}
.confetti:nth-child(95):before { top: 37.39247997%; left: 89.88116991%; color: #a8afa0;
}
.confetti:nth-child(94) { top: 22.31487712%; left: 42.08684422%; color: #b2cff0;
}
.confetti:nth-child(94):after { top: 31.72076262%; left: 77.75754048%; color: #c4bcfe;
}
.confetti:nth-child(94):before { top: 25.08817902%; left: 8.10739312%; color: #9ffdc8;
}
.confetti:nth-child(93) { top: 45.24312429%; left: 72.63377886%; color: #98ecdb;
}
.confetti:nth-child(93):after { top: 59.38812336%; left: 51.34391887%; color: #f9e4ae;
}
.confetti:nth-child(93):before { top: 81.74218958%; left: 46.36439352%; color: #c4dcbf;
}
.confetti:nth-child(92) { top: 78.0218928%; left: 35.62084083%; color: #aafae9;
}
.confetti:nth-child(92):after { top: 56.33696975%; left: 26.91927777%; color: #ffffe5;
}
.confetti:nth-child(92):before { top: 13.21713884%; left: 83.08969761%; color: #dba8c0;
}
.confetti:nth-child(91) { top: 77.7594442%; left: 68.9856647%; color: #a4a99f;
}
.confetti:nth-child(91):after { top: 30.75947263%; left: 6.60138615%; color: #b5d1aa;
}
.confetti:nth-child(91):before { top: 71.52100389%; left: 8.33321008%; color: #d7bbef;
}
.confetti:nth-child(90) { top: 42.06967636%; left: 3.63696575%; color: #d9bad3;
}
.confetti:nth-child(90):after { top: 76.37881286%; left: 25.49256216%; color: #acc1ce;
}
.confetti:nth-child(90):before { top: 47.94170934%; left: 40.03587275%; color: #d59bcf;
}
.confetti:nth-child(89) { top: 75.95257098%; left: 58.73293421%; color: #bff3d7;
}
.confetti:nth-child(89):after { top: 46.08535994%; left: 45.95795007%; color: #f5d6aa;
}
.confetti:nth-child(89):before { top: 8.36823396%; left: 30.23476667%; color: #fd99cb;
}
.confetti:nth-child(88) { top: 72.14580279%; left: 11.50311755%; color: #d4cbc8;
}
.confetti:nth-child(88):after { top: 34.83851979%; left: 24.56762541%; color: #dba4cf;
}
.confetti:nth-child(88):before { top: 87.80997975%; left: 30.42128815%; color: #d9f1b8;
}
.confetti:nth-child(87) { top: 67.54452517%; left: 38.81454268%; color: #eb9aa2;
}
.confetti:nth-child(87):after { top: 35.30083674%; left: 79.98434756%; color: #c1aba2;
}
.confetti:nth-child(87):before { top: 86.24490782%; left: 53.06478824%; color: #e4ffdd;
}
.confetti:nth-child(86) { top: 8.79196147%; left: 37.28522137%; color: #c3cde0;
}
.confetti:nth-child(86):after { top: 40.10240769%; left: 77.03938076%; color: #d396b7;
}
.confetti:nth-child(86):before { top: 41.35873065%; left: 43.086356%; color: #d7b3c7;
}
.confetti:nth-child(85) { top: 52.31580857%; left: 54.75898352%; color: #a4deff;
}
.confetti:nth-child(85):after { top: 35.33607713%; left: 0.73648726%; color: #d2b1b7;
}
.confetti:nth-child(85):before { top: 44.51489253%; left: 62.53570999%; color: #9fa2c4;
}
.confetti:nth-child(84) { top: 45.4504208%; left: 17.39547268%; color: #e6d4ad;
}
.confetti:nth-child(84):after { top: 53.27256785%; left: 7.58712078%; color: #f59f9b;
}
.confetti:nth-child(84):before { top: 22.39728636%; left: 79.26819073%; color: #99c3af;
}
.confetti:nth-child(83) { top: 39.02609821%; left: 19.88484598%; color: #cdcfa7;
}
.confetti:nth-child(83):after { top: 74.0270091%; left: 80.58497112%; color: #99f1d3;
}
.confetti:nth-child(83):before { top: 46.59578644%; left: 76.06646463%; color: #cfafee;
}
.confetti:nth-child(82) { top: 42.84176295%; left: 56.14078164%; color: #f2c5be;
}
.confetti:nth-child(82):after { top: 56.22715299%; left: 16.02706375%; color: #e89ac7;
}
.confetti:nth-child(82):before { top: 33.26894087%; left: 73.26157328%; color: #e1d4f6;
}
.confetti:nth-child(81) { top: 40.57144493%; left: 84.06578384%; color: #9deed4;
}
.confetti:nth-child(81):after { top: 61.74275754%; left: 9.16922625%; color: #f1dcac;
}
.confetti:nth-child(81):before { top: 49.67947327%; left: 34.08741047%; color: #eb9dbe;
}
.confetti:nth-child(80) { top: 45.63181676%; left: 50.28834025%; color: #b9beea;
}
.confetti:nth-child(80):after { top: 38.19425607%; left: 66.96677991%; color: #d5ccda;
}
.confetti:nth-child(80):before { top: 79.1228579%; left: 88.58308776%; color: #b89ddc;
}
.confetti:nth-child(79) { top: 16.73732056%; left: 85.3031089%; color: #f3b5e8;
}
.confetti:nth-child(79):after { top: 54.24364928%; left: 1.79404143%; color: #c7f3e0;
}
.confetti:nth-child(79):before { top: 58.33431267%; left: 26.53078276%; color: #a5d298;
}
.confetti:nth-child(78) { top: 55.84787019%; left: 15.37019001%; color: #b2a999;
}
.confetti:nth-child(78):after { top: 59.76124629%; left: 85.94921414%; color: #d49eaf;
}
.confetti:nth-child(78):before { top: 4.03505869%; left: 32.10690133%; color: #faf0c0;
}
.confetti:nth-child(77) { top: 30.94729983%; left: 81.68826595%; color: #ecb9bb;
}
.confetti:nth-child(77):after { top: 9.04230968%; left: 41.37519598%; color: #e2c4b0;
}
.confetti:nth-child(77):before { top: 48.39331591%; left: 54.52826585%; color: #f5a8a1;
}
.confetti:nth-child(76) { top: 11.70475649%; left: 77.72837827%; color: #d5ffcf;
}
.confetti:nth-child(76):after { top: 84.84747659%; left: 82.26124701%; color: #e0aad7;
}
.confetti:nth-child(76):before { top: 31.7286248%; left: 40.36793004%; color: #a3fcd7;
}
.confetti:nth-child(75) { top: 85.9632199%; left: 25.06076934%; color: #d3b0d7;
}
.confetti:nth-child(75):after { top: 12.24281034%; left: 49.90355589%; color: #abde98;
}
.confetti:nth-child(75):before { top: 12.75288576%; left: 66.00108066%; color: #a1d6a9;
}
.confetti:nth-child(74) { top: 49.37170234%; left: 74.57523785%; color: #9bbaef;
}
.confetti:nth-child(74):after { top: 24.92601386%; left: 52.72342844%; color: #b8f8fd;
}
.confetti:nth-child(74):before { top: 22.37071516%; left: 56.84307499%; color: #bfbfc4;
}
.confetti:nth-child(73) { top: 89.25523662%; left: 66.71183684%; color: #f0d6e9;
}
.confetti:nth-child(73):after { top: 51.24766726%; left: 64.61645725%; color: #f6debd;
}
.confetti:nth-child(73):before { top: 32.00358538%; left: 36.48281811%; color: #d0bfc9;
}
.confetti:nth-child(72) { top: 85.11165349%; left: 54.88686804%; color: #ecf59f;
}
.confetti:nth-child(72):after { top: 60.83723315%; left: 59.56939989%; color: #f4c3e4;
}
.confetti:nth-child(72):before { top: 25.89141062%; left: 86.90798842%; color: #ccbbc7;
}
.confetti:nth-child(71) { top: 5.14357391%; left: 43.58783782%; color: #f7e39d;
}
.confetti:nth-child(71):after { top: 34.79216341%; left: 72.65199751%; color: #d2a696;
}
.confetti:nth-child(71):before { top: 63.28172951%; left: 31.05632687%; color: #dcc39e;
}
.confetti:nth-child(70) { top: 8.38481335%; left: 69.12951465%; color: #ecc2f9;
}
.confetti:nth-child(70):after { top: 46.31737955%; left: 8.47261739%; color: #b9e2cc;
}
.confetti:nth-child(70):before { top: 50.89851041%; left: 68.91794387%; color: #d29ed9;
}
.confetti:nth-child(69) { top: 58.67904308%; left: 34.89068622%; color: #e8cdb9;
}
.confetti:nth-child(69):after { top: 6.17209956%; left: 41.79015695%; color: #eaaaca;
}
.confetti:nth-child(69):before { top: 24.04958664%; left: 86.95684126%; color: #c2a1dd;
}
.confetti:nth-child(68) { top: 57.49567662%; left: 41.66470521%; color: #f7f6b9;
}
.confetti:nth-child(68):after { top: 76.93179398%; left: 8.00135257%; color: #9c9fa0;
}
.confetti:nth-child(68):before { top: 29.29496008%; left: 47.33048036%; color: #fb96ef;
}
.confetti:nth-child(67) { top: 47.65043817%; left: 64.51881279%; color: #bda3e8;
}
.confetti:nth-child(67):after { top: 31.70726943%; left: 8.3311571%; color: #fabad6;
}
.confetti:nth-child(67):before { top: 76.2597043%; left: 32.1394686%; color: #e7dfdc;
}
.confetti:nth-child(66) { top: 75.1972118%; left: 35.35263971%; color: #cfe6c0;
}
.confetti:nth-child(66):after { top: 52.68075873%; left: 50.30116779%; color: #a1b0e9;
}
.confetti:nth-child(66):before { top: 85.11570384%; left: 56.67529762%; color: #98969d;
}
.confetti:nth-child(65) { top: 74.6104983%; left: 75.40949435%; color: #a2b0bb;
}
.confetti:nth-child(65):after { top: 18.79409232%; left: 5.34567982%; color: #ebcf97;
}
.confetti:nth-child(65):before { top: 8.32181159%; left: 83.79547547%; color: #9bcacd;
}
.confetti:nth-child(64) { top: 52.25319768%; left: 11.00392132%; color: #bf9fc9;
}
.confetti:nth-child(64):after { top: 46.71083614%; left: 58.69900892%; color: #c3e3d0;
}
.confetti:nth-child(64):before { top: 77.369949%; left: 81.80868463%; color: #a7f7ae;
}
.confetti:nth-child(63) { top: 14.17433035%; left: 44.43483312%; color: #dfe5bf;
}
.confetti:nth-child(63):after { top: 57.83166586%; left: 46.49529418%; color: #cbafbc;
}
.confetti:nth-child(63):before { top: 26.20023103%; left: 68.49607298%; color: #9aa6f0;
}
.confetti:nth-child(62) { top: 87.12960062%; left: 67.30578504%; color: #e0ddc5;
}
.confetti:nth-child(62):after { top: 60.09002217%; left: 8.70076967%; color: #9abbda;
}
.confetti:nth-child(62):before { top: 63.24222415%; left: 48.78259882%; color: #f1be9e;
}
.confetti:nth-child(61) { top: 38.29856123%; left: 45.03575362%; color: #b2dfe7;
}
.confetti:nth-child(61):after { top: 46.79624566%; left: 70.96626525%; color: #99cfdd;
}
.confetti:nth-child(61):before { top: 4.3418969%; left: 74.52097299%; color: #f6f49b;
}
.confetti:nth-child(60) { top: 43.19225646%; left: 82.15255581%; color: #efc2e8;
}
.confetti:nth-child(60):after { top: 13.33842131%; left: 12.6959425%; color: #acb1f8;
}
.confetti:nth-child(60):before { top: 87.55028226%; left: 40.35598253%; color: #edcdaf;
}
.confetti:nth-child(59) { top: 77.03173062%; left: 76.75087502%; color: #f7e2af;
}
.confetti:nth-child(59):after { top: 13.58922979%; left: 30.5560907%; color: #bdd296;
}
.confetti:nth-child(59):before { top: 67.22919349%; left: 2.48421132%; color: #d7d3f2;
}
.confetti:nth-child(58) { top: 32.90516485%; left: 88.96388998%; color: #bfaaca;
}
.confetti:nth-child(58):after { top: 28.63512179%; left: 52.13578155%; color: #d4c599;
}
.confetti:nth-child(58):before { top: 65.53415428%; left: 48.96921324%; color: #b498a8;
}
.confetti:nth-child(57) { top: 29.0302397%; left: 62.7697843%; color: #ecdbb5;
}
.confetti:nth-child(57):after { top: 78.61964735%; left: 17.72926735%; color: #fef696;
}
.confetti:nth-child(57):before { top: 4.97884545%; left: 26.68348853%; color: #ccdfe6;
}
.confetti:nth-child(56) { top: 18.81659436%; left: 45.50052132%; color: #aba3ce;
}
.confetti:nth-child(56):after { top: 1.05162121%; left: 54.9311502%; color: #bcf0f5;
}
.confetti:nth-child(56):before { top: 34.50279526%; left: 23.53084807%; color: #f9b99e;
}
.confetti:nth-child(55) { top: 57.57599326%; left: 44.69166934%; color: #b3d8cb;
}
.confetti:nth-child(55):after { top: 51.9435184%; left: 11.32858774%; color: #d4ede8;
}
.confetti:nth-child(55):before { top: 28.48946872%; left: 44.62049693%; color: #f3eacc;
}
.confetti:nth-child(54) { top: 27.46372109%; left: 1.37096324%; color: #daf4d6;
}
.confetti:nth-child(54):after { top: 74.69322946%; left: 40.42681638%; color: #ecacd6;
}
.confetti:nth-child(54):before { top: 61.65636998%; left: 69.57504687%; color: #bfaffa;
}
.confetti:nth-child(53) { top: 65.77037001%; left: 83.38833718%; color: #ccd1bb;
}
.confetti:nth-child(53):after { top: 15.59581299%; left: 28.29751336%; color: #ecc1b9;
}
.confetti:nth-child(53):before { top: 23.01528458%; left: 68.36851252%; color: #c5f8f4;
}
.confetti:nth-child(52) { top: 24.62580055%; left: 13.8018563%; color: #ff9ae8;
}
.confetti:nth-child(52):after { top: 49.64391521%; left: 34.30437434%; color: #b296b4;
}
.confetti:nth-child(52):before { top: 64.83049885%; left: 67.85444749%; color: #dd9fb1;
}
.confetti:nth-child(51) { top: 9.94289019%; left: 82.94857556%; color: #b6d3da;
}
.confetti:nth-child(51):after { top: 58.45114756%; left: 59.72969331%; color: #eac7a0;
}
.confetti:nth-child(51):before { top: 82.41699368%; left: 75.34931751%; color: #9acea8;
}
.confetti:nth-child(50) { top: 70.78390901%; left: 36.04173322%; color: #bcbac2;
}
.confetti:nth-child(50):after { top: 53.99914549%; left: 60.74428468%; color: #a0fdfe;
}
.confetti:nth-child(50):before { top: 60.40104122%; left: 38.06310749%; color: #b5f4b5;
}
.confetti:nth-child(49) { top: 10.6036497%; left: 20.41049631%; color: #ebd4f3;
}
.confetti:nth-child(49):after { top: 39.4086616%; left: 87.41507674%; color: #9ea6fe;
}
.confetti:nth-child(49):before { top: 15.74885284%; left: 2.31123204%; color: #eabcbb;
}
.confetti:nth-child(48) { top: 14.8522672%; left: 35.57176824%; color: #a09ff4;
}
.confetti:nth-child(48):after { top: 44.9777161%; left: 51.14806253%; color: #d0e4b5;
}
.confetti:nth-child(48):before { top: 46.27013896%; left: 26.01206986%; color: #a1e6ab;
}
.confetti:nth-child(47) { top: 61.05543863%; left: 49.03601424%; color: #c8d5be;
}
.confetti:nth-child(47):after { top: 54.39715277%; left: 40.48416687%; color: #b6f5d0;
}
.confetti:nth-child(47):before { top: 36.30151224%; left: 26.33113561%; color: #f6c49c;
}
.confetti:nth-child(46) { top: 23.80690735%; left: 30.73270339%; color: #d7bc9f;
}
.confetti:nth-child(46):after { top: 0.15530103%; left: 10.21527038%; color: #b799a6;
}
.confetti:nth-child(46):before { top: 79.37157388%; left: 58.03614262%; color: #daa7d5;
}
.confetti:nth-child(45) { top: 77.4092661%; left: 59.87103066%; color: #aac7f7;
}
.confetti:nth-child(45):after { top: 50.13554733%; left: 82.08927133%; color: #acc2b5;
}
.confetti:nth-child(45):before { top: 46.03170032%; left: 62.48384123%; color: #daeae5;
}
.confetti:nth-child(44) { top: 44.57551775%; left: 80.042862%; color: #b298d9;
}
.confetti:nth-child(44):after { top: 28.04735122%; left: 78.14127633%; color: #a9fecc;
}
.confetti:nth-child(44):before { top: 16.14735045%; left: 86.03067241%; color: #dfcbe4;
}
.confetti:nth-child(43) { top: 33.47752111%; left: 51.93888893%; color: #feade4;
}
.confetti:nth-child(43):after { top: 11.74814652%; left: 49.0082639%; color: #edaae9;
}
.confetti:nth-child(43):before { top: 78.07930521%; left: 84.2439226%; color: #fabdd9;
}
.confetti:nth-child(42) { top: 13.74809561%; left: 34.43363779%; color: #98dfd7;
}
.confetti:nth-child(42):after { top: 27.89496068%; left: 29.37292781%; color: #b2acd0;
}
.confetti:nth-child(42):before { top: 51.34958263%; left: 1.22772041%; color: #eeceb2;
}
.confetti:nth-child(41) { top: 58.44841001%; left: 16.19233967%; color: #eabda3;
}
.confetti:nth-child(41):after { top: 36.54862657%; left: 62.77890245%; color: #e6bcef;
}
.confetti:nth-child(41):before { top: 14.4385622%; left: 47.27567376%; color: #f6d7e1;
}
.confetti:nth-child(40) { top: 31.30555666%; left: 63.82255482%; color: #eed2bc;
}
.confetti:nth-child(40):after { top: 67.55903902%; left: 13.96209406%; color: #99f199;
}
.confetti:nth-child(40):before { top: 72.68151893%; left: 47.00913532%; color: #e1cff4;
}
.confetti:nth-child(39) { top: 11.05638613%; left: 7.19598453%; color: #bcb3e6;
}
.confetti:nth-child(39):after { top: 0.2203651%; left: 20.56703929%; color: #a4abeb;
}
.confetti:nth-child(39):before { top: 53.76000077%; left: 82.1530516%; color: #a6a8d5;
}
.confetti:nth-child(38) { top: 65.05828721%; left: 14.03603374%; color: #f3c4af;
}
.confetti:nth-child(38):after { top: 17.55565136%; left: 78.53135208%; color: #b4cbae;
}
.confetti:nth-child(38):before { top: 52.8128819%; left: 17.81910067%; color: #e9e1c4;
}
.confetti:nth-child(37) { top: 23.70167105%; left: 31.15463926%; color: #bbd3a9;
}
.confetti:nth-child(37):after { top: 59.34458685%; left: 57.24337304%; color: #efe1fb;
}
.confetti:nth-child(37):before { top: 18.28272285%; left: 79.42494119%; color: #bfd4b7;
}
.confetti:nth-child(36) { top: 20.52863281%; left: 53.40731469%; color: #b8b7cc;
}
.confetti:nth-child(36):after { top: 79.87717057%; left: 88.76677052%; color: #f6fab2;
}
.confetti:nth-child(36):before { top: 2.4434737%; left: 45.46821091%; color: #cfd2c4;
}
.confetti:nth-child(35) { top: 48.85830859%; left: 81.99638469%; color: #caece2;
}
.confetti:nth-child(35):after { top: 67.76924219%; left: 55.81531534%; color: #e5d4b9;
}
.confetti:nth-child(35):before { top: 40.3261382%; left: 53.65691859%; color: #a8a3d3;
}
.confetti:nth-child(34) { top: 84.00146398%; left: 12.60802782%; color: #edfdf0;
}
.confetti:nth-child(34):after { top: 1.57075545%; left: 62.35006643%; color: #cff8a8;
}
.confetti:nth-child(34):before { top: 30.8924949%; left: 70.38756365%; color: #f4a7c0;
}
.confetti:nth-child(33) { top: 35.82953827%; left: 79.97048691%; color: #dcfbd4;
}
.confetti:nth-child(33):after { top: 1.1198419%; left: 34.25406953%; color: #adb9d0;
}
.confetti:nth-child(33):before { top: 69.63194051%; left: 56.82243862%; color: #c19dc4;
}
.confetti:nth-child(32) { top: 10.50761869%; left: 1.59788725%; color: #ffd29d;
}
.confetti:nth-child(32):after { top: 65.71619536%; left: 12.97898734%; color: #b8d6b3;
}
.confetti:nth-child(32):before { top: 21.32741326%; left: 56.5716821%; color: #aae3c1;
}
.confetti:nth-child(31) { top: 17.95351436%; left: 64.95615297%; color: #e7f1e7;
}
.confetti:nth-child(31):after { top: 22.54096657%; left: 61.99284384%; color: #9e9cfd;
}
.confetti:nth-child(31):before { top: 16.29810122%; left: 6.26019227%; color: #9997be;
}
.confetti:nth-child(30) { top: 75.5035023%; left: 68.6757362%; color: #aea4d3;
}
.confetti:nth-child(30):after { top: 46.86282792%; left: 19.43572856%; color: #d396f9;
}
.confetti:nth-child(30):before { top: 62.18648326%; left: 5.454695%; color: #dd9bc8;
}
.confetti:nth-child(29) { top: 18.22460569%; left: 81.73305708%; color: #f0b7f7;
}
.confetti:nth-child(29):after { top: 54.29782877%; left: 71.01588346%; color: #fcb697;
}
.confetti:nth-child(29):before { top: 56.36058683%; left: 68.79393463%; color: #eebed4;
}
.confetti:nth-child(28) { top: 23.67794198%; left: 46.87410311%; color: #b9fdf9;
}
.confetti:nth-child(28):after { top: 32.18953736%; left: 63.2201532%; color: #9cd7db;
}
.confetti:nth-child(28):before { top: 46.26219205%; left: 1.11642221%; color: #ced2c3;
}
.confetti:nth-child(27) { top: 72.59599041%; left: 28.65362073%; color: #afb0ff;
}
.confetti:nth-child(27):after { top: 38.26067482%; left: 0.47753647%; color: #d39bd8;
}
.confetti:nth-child(27):before { top: 79.3386957%; left: 15.41657877%; color: #dfc8f4;
}
.confetti:nth-child(26) { top: 18.56896876%; left: 2.24044328%; color: #e7c2c7;
}
.confetti:nth-child(26):after { top: 83.03716804%; left: 1.49737128%; color: #a3a2ff;
}
.confetti:nth-child(26):before { top: 34.11200975%; left: 79.08002581%; color: #bec2cb;
}
.confetti:nth-child(25) { top: 12.48532099%; left: 28.26146807%; color: #daa5d9;
}
.confetti:nth-child(25):after { top: 61.30657868%; left: 81.11633578%; color: #c6e9c0;
}
.confetti:nth-child(25):before { top: 37.7883221%; left: 18.05230699%; color: #ccd2dc;
}
.confetti:nth-child(24) { top: 16.29544917%; left: 43.89661259%; color: #f09a9a;
}
.confetti:nth-child(24):after { top: 63.84037707%; left: 29.56631508%; color: #a7bee3;
}
.confetti:nth-child(24):before { top: 75.7612537%; left: 47.1470198%; color: #afbdf0;
}
.confetti:nth-child(23) { top: 85.99012279%; left: 74.69450125%; color: #ecf6f3;
}
.confetti:nth-child(23):after { top: 27.42880824%; left: 12.13038348%; color: #a9ebf1;
}
.confetti:nth-child(23):before { top: 74.54325159%; left: 47.88280514%; color: #dffcf1;
}
.confetti:nth-child(22) { top: 28.95079034%; left: 79.09035831%; color: #b4b9aa;
}
.confetti:nth-child(22):after { top: 42.33775316%; left: 54.24606329%; color: #acafb9;
}
.confetti:nth-child(22):before { top: 34.77067051%; left: 67.88161418%; color: #ececd6;
}
.confetti:nth-child(21) { top: 32.52870713%; left: 51.00301409%; color: #d8ebdb;
}
.confetti:nth-child(21):after { top: 83.24096136%; left: 5.43034625%; color: #9cdfcb;
}
.confetti:nth-child(21):before { top: 65.62422937%; left: 74.66446229%; color: #fdb3d3;
}
.confetti:nth-child(20) { top: 13.57022423%; left: 56.6256058%; color: #f5caa7;
}
.confetti:nth-child(20):after { top: 18.51940437%; left: 88.54534642%; color: #c3bab7;
}
.confetti:nth-child(20):before { top: 46.24163866%; left: 71.23752212%; color: #aea6d7;
}
.confetti:nth-child(19) { top: 10.79405932%; left: 17.08765295%; color: #98a0a9;
}
.confetti:nth-child(19):after { top: 63.97810957%; left: 78.98755041%; color: #e7b1e0;
}
.confetti:nth-child(19):before { top: 12.31866441%; left: 88.60176287%; color: #dfd8e6;
}
.confetti:nth-child(18) { top: 81.07066325%; left: 16.93776935%; color: #b0b5bd;
}
.confetti:nth-child(18):after { top: 73.88149666%; left: 71.23736205%; color: #b7c8a0;
}
.confetti:nth-child(18):before { top: 58.18189665%; left: 53.17243057%; color: #a2f3aa;
}
.confetti:nth-child(17) { top: 36.80478539%; left: 27.01526211%; color: #f7feba;
}
.confetti:nth-child(17):after { top: 17.64405837%; left: 70.72554382%; color: #cdf1d7;
}
.confetti:nth-child(17):before { top: 62.08021875%; left: 70.95477762%; color: #d6f2fd;
}
.confetti:nth-child(16) { top: 88.92996467%; left: 48.28548667%; color: #bbe39a;
}
.confetti:nth-child(16):after { top: 43.74205543%; left: 65.77425861%; color: #ecb3fa;
}
.confetti:nth-child(16):before { top: 84.93680697%; left: 81.69904139%; color: #a9e2e0;
}
.confetti:nth-child(15) { top: 54.41247636%; left: 35.7673385%; color: #b4e999;
}
.confetti:nth-child(15):after { top: 17.4148828%; left: 68.00531808%; color: #cdf7b8;
}
.confetti:nth-child(15):before { top: 60.60463467%; left: 86.21806844%; color: #ccbec6;
}
.confetti:nth-child(14) { top: 13.97862747%; left: 36.22834175%; color: #d5f3e7;
}
.confetti:nth-child(14):after { top: 39.80228323%; left: 80.80105839%; color: #a2a9d5;
}
.confetti:nth-child(14):before { top: 19.70641001%; left: 72.23359763%; color: #d6e8a0;
}
.confetti:nth-child(13) { top: 8.41999192%; left: 68.31962365%; color: #caada6;
}
.confetti:nth-child(13):after { top: 26.20869636%; left: 32.02763633%; color: #9ca5fb;
}
.confetti:nth-child(13):before { top: 62.6983748%; left: 61.55129077%; color: #f4fafe;
}
.confetti:nth-child(12) { top: 64.52506605%; left: 31.47567646%; color: #d3f5e1;
}
.confetti:nth-child(12):after { top: 58.7682891%; left: 20.98752063%; color: #cbbbfd;
}
.confetti:nth-child(12):before { top: 34.74842787%; left: 47.41115591%; color: #f9c89e;
}
.confetti:nth-child(11) { top: 4.90142358%; left: 0.24727226%; color: #cecde0;
}
.confetti:nth-child(11):after { top: 79.50352448%; left: 18.53352754%; color: #f898dd;
}
.confetti:nth-child(11):before { top: 9.22959997%; left: 86.90423425%; color: #daffa0;
}
.confetti:nth-child(10) { top: 3.12645405%; left: 31.31744932%; color: #e5e8de;
}
.confetti:nth-child(10):after { top: 80.06747469%; left: 24.70314381%; color: #99e1e8;
}
.confetti:nth-child(10):before { top: 43.09500216%; left: 31.68217782%; color: #9cb6c1;
}
.confetti:nth-child(9) { top: 23.93771644%; left: 30.74785125%; color: #dab2e9;
}
.confetti:nth-child(9):after { top: 78.2025264%; left: 62.5360126%; color: #aaf29e;
}
.confetti:nth-child(9):before { top: 3.94385369%; left: 79.18327143%; color: #f7a9dc;
}
.confetti:nth-child(8) { top: 83.10420725%; left: 46.16771769%; color: #a098dc;
}
.confetti:nth-child(8):after { top: 57.31698798%; left: 37.99025748%; color: #e1eaec;
}
.confetti:nth-child(8):before { top: 44.47600752%; left: 11.62958515%; color: #ecf5b1;
}
.confetti:nth-child(7) { top: 18.9310341%; left: 61.77847348%; color: #a5fdd1;
}
.confetti:nth-child(7):after { top: 35.17184694%; left: 13.38961686%; color: #c9a0a6;
}
.confetti:nth-child(7):before { top: 57.77289805%; left: 55.85643291%; color: #fce6ce;
}
.confetti:nth-child(6) { top: 85.9093576%; left: 41.71752428%; color: #c6edfd;
}
.confetti:nth-child(6):after { top: 31.0179344%; left: 3.47836524%; color: #dedfd0;
}
.confetti:nth-child(6):before { top: 27.60276435%; left: 63.75924186%; color: #a7e5e7;
}
.confetti:nth-child(5) { top: 18.52474041%; left: 21.88495589%; color: #b6b6d2;
}
.confetti:nth-child(5):after { top: 62.29856424%; left: 46.57996557%; color: #d2d5e7;
}
.confetti:nth-child(5):before { top: 55.90596506%; left: 81.62436%; color: #afafa3;
}
.confetti:nth-child(4) { top: 74.97008234%; left: 89.01667525%; color: #fcd0c6;
}
.confetti:nth-child(4):after { top: 78.89098522%; left: 39.46691121%; color: #cdb5fe;
}
.confetti:nth-child(4):before { top: 69.78075718%; left: 41.73556903%; color: #febbe4;
}
.confetti:nth-child(3) { top: 21.91200377%; left: 58.58913416%; color: #b9dee1;
}
.confetti:nth-child(3):after { top: 52.74566586%; left: 76.61367433%; color: #b9abaa;
}
.confetti:nth-child(3):before { top: 76.45955052%; left: 36.96092671%; color: #e0cfc9;
}
.confetti:nth-child(2) { top: 34.60378416%; left: 10.00788946%; color: #f2a4c8;
}
.confetti:nth-child(2):after { top: 37.60265487%; left: 7.43494121%; color: #b7dccf;
}
.confetti:nth-child(2):before { top: 53.12746025%; left: 25.73243547%; color: #97aed9;
}
.confetti:nth-child(1) { top: 52.40035974%; left: 49.33160417%; color: #f2a9ae;
}
.confetti:nth-child(1):after { top: 7.09682852%; left: 52.89142391%; color: #eeebd8;
}
.confetti:nth-child(1):before { top: 74.2346973%; left: 75.75009049%; color: #baa69b;
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body>
<div class="envelope"></div>
<div class="envelope-top"></div>
<div class="card">Happy Birthday<br> Mom!! :D <3</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div>
<div class="confetti">&#128570;</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

A Pen by Nick Colley - Script Codes CSS Codes

.absolute-center,
.envelope,
.envelope-top,
.card { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;
}
.anim-card { transition: transform 1s 1s; transform: translateY(-30%); animation: slide-up 10s 1s;
}
@keyframes slide-up { 0% { z-index: 2; } 100% { z-index: 2; }
}
.anim-explosion { animation: explosion 2s 1s infinite alternate;
}
@keyframes explosion { 50% { opacity: 1; } 100% { opacity: 1; transform: rotate(25deg); }
}
* { box-sizing: border-box;
}
body { overflow: hidden; background-color: #556; background-image: radial-gradient(#334, #556);
}
.envelope,
.envelope-top { height: 0; width: 0; border: 100px solid #ccc; border-top-width: 80px; border-bottom-width: 50px; border-bottom-color: #d1d1d1;
}
.envelope { z-index: 3; border-top-color: transparent;
}
.envelope:hover ~ .envelope-top { transform: rotateX(180deg);
}
.envelope:hover ~ .card { transition: transform 1s 1s; transform: translateY(-30%); animation: slide-up 10s 1s;
}
.envelope:hover ~ .confetti,
.envelope:hover ~ .confetti:after,
.envelope:hover ~ .confetti:before { animation: explosion 2s 1s infinite alternate;
}
.envelope-top { z-index: 2; border-color: transparent; border-top-color: #d1d1d1; background: none; transform-origin: top; transition: transform 1s; pointer-events: none;
}
.card { z-index: 1; height: 130px; width: 200px; background-color: #e6e6e6; text-align: center; color: orangered; font-weight: bolder; padding-top: 43.33333333px;
}
.confetti { opacity: 0;
}
.confetti,
.confetti:after,
.confetti:before { top: 0; left: 0; position: absolute; content: ''; width: 10px; height: 10px; color: red; font-size: 1.5em;
}
.confetti:after,
.confetti:after:after,
.confetti:before:after { color: blue;
}
.confetti:before,
.confetti:after:before,
.confetti:before:before { color: purple;
}
.confetti:after { content: '\01F63C'; margin: 45px;
}
.confetti:before { content: '\01F63D'; margin: -45px;
}
.confetti:nth-child(100) { top: 10.28105092%; left: 71.28205907%; color: #abc7bd;
}
.confetti:nth-child(100):after { top: 29.93617865%; left: 7.14057701%; color: #c2a4b9;
}
.confetti:nth-child(100):before { top: 85.21504098%; left: 28.21575573%; color: #eab9ef;
}
.confetti:nth-child(99) { top: 81.9389468%; left: 23.39336235%; color: #d3ddf2;
}
.confetti:nth-child(99):after { top: 60.30566103%; left: 36.68657103%; color: #d99fa0;
}
.confetti:nth-child(99):before { top: 67.28008218%; left: 21.08519616%; color: #9cd8ff;
}
.confetti:nth-child(98) { top: 64.12047605%; left: 62.89515289%; color: #fbe4f2;
}
.confetti:nth-child(98):after { top: 70.05192494%; left: 81.39296128%; color: #e9b69d;
}
.confetti:nth-child(98):before { top: 49.07243791%; left: 66.52248623%; color: #e7f3df;
}
.confetti:nth-child(97) { top: 52.89930458%; left: 46.49825499%; color: #9aa1f5;
}
.confetti:nth-child(97):after { top: 73.5551788%; left: 65.96278352%; color: #d5b0f0;
}
.confetti:nth-child(97):before { top: 5.27194571%; left: 11.62122064%; color: #9ba0f9;
}
.confetti:nth-child(96) { top: 3.10555019%; left: 5.77397643%; color: #d5abcd;
}
.confetti:nth-child(96):after { top: 11.06194247%; left: 18.24363122%; color: #ddfdde;
}
.confetti:nth-child(96):before { top: 51.45592449%; left: 45.84444726%; color: #9eb9a9;
}
.confetti:nth-child(95) { top: 1.59000064%; left: 39.54835928%; color: #eab697;
}
.confetti:nth-child(95):after { top: 54.25144034%; left: 16.68766826%; color: #a09ccc;
}
.confetti:nth-child(95):before { top: 37.39247997%; left: 89.88116991%; color: #a8afa0;
}
.confetti:nth-child(94) { top: 22.31487712%; left: 42.08684422%; color: #b2cff0;
}
.confetti:nth-child(94):after { top: 31.72076262%; left: 77.75754048%; color: #c4bcfe;
}
.confetti:nth-child(94):before { top: 25.08817902%; left: 8.10739312%; color: #9ffdc8;
}
.confetti:nth-child(93) { top: 45.24312429%; left: 72.63377886%; color: #98ecdb;
}
.confetti:nth-child(93):after { top: 59.38812336%; left: 51.34391887%; color: #f9e4ae;
}
.confetti:nth-child(93):before { top: 81.74218958%; left: 46.36439352%; color: #c4dcbf;
}
.confetti:nth-child(92) { top: 78.0218928%; left: 35.62084083%; color: #aafae9;
}
.confetti:nth-child(92):after { top: 56.33696975%; left: 26.91927777%; color: #ffffe5;
}
.confetti:nth-child(92):before { top: 13.21713884%; left: 83.08969761%; color: #dba8c0;
}
.confetti:nth-child(91) { top: 77.7594442%; left: 68.9856647%; color: #a4a99f;
}
.confetti:nth-child(91):after { top: 30.75947263%; left: 6.60138615%; color: #b5d1aa;
}
.confetti:nth-child(91):before { top: 71.52100389%; left: 8.33321008%; color: #d7bbef;
}
.confetti:nth-child(90) { top: 42.06967636%; left: 3.63696575%; color: #d9bad3;
}
.confetti:nth-child(90):after { top: 76.37881286%; left: 25.49256216%; color: #acc1ce;
}
.confetti:nth-child(90):before { top: 47.94170934%; left: 40.03587275%; color: #d59bcf;
}
.confetti:nth-child(89) { top: 75.95257098%; left: 58.73293421%; color: #bff3d7;
}
.confetti:nth-child(89):after { top: 46.08535994%; left: 45.95795007%; color: #f5d6aa;
}
.confetti:nth-child(89):before { top: 8.36823396%; left: 30.23476667%; color: #fd99cb;
}
.confetti:nth-child(88) { top: 72.14580279%; left: 11.50311755%; color: #d4cbc8;
}
.confetti:nth-child(88):after { top: 34.83851979%; left: 24.56762541%; color: #dba4cf;
}
.confetti:nth-child(88):before { top: 87.80997975%; left: 30.42128815%; color: #d9f1b8;
}
.confetti:nth-child(87) { top: 67.54452517%; left: 38.81454268%; color: #eb9aa2;
}
.confetti:nth-child(87):after { top: 35.30083674%; left: 79.98434756%; color: #c1aba2;
}
.confetti:nth-child(87):before { top: 86.24490782%; left: 53.06478824%; color: #e4ffdd;
}
.confetti:nth-child(86) { top: 8.79196147%; left: 37.28522137%; color: #c3cde0;
}
.confetti:nth-child(86):after { top: 40.10240769%; left: 77.03938076%; color: #d396b7;
}
.confetti:nth-child(86):before { top: 41.35873065%; left: 43.086356%; color: #d7b3c7;
}
.confetti:nth-child(85) { top: 52.31580857%; left: 54.75898352%; color: #a4deff;
}
.confetti:nth-child(85):after { top: 35.33607713%; left: 0.73648726%; color: #d2b1b7;
}
.confetti:nth-child(85):before { top: 44.51489253%; left: 62.53570999%; color: #9fa2c4;
}
.confetti:nth-child(84) { top: 45.4504208%; left: 17.39547268%; color: #e6d4ad;
}
.confetti:nth-child(84):after { top: 53.27256785%; left: 7.58712078%; color: #f59f9b;
}
.confetti:nth-child(84):before { top: 22.39728636%; left: 79.26819073%; color: #99c3af;
}
.confetti:nth-child(83) { top: 39.02609821%; left: 19.88484598%; color: #cdcfa7;
}
.confetti:nth-child(83):after { top: 74.0270091%; left: 80.58497112%; color: #99f1d3;
}
.confetti:nth-child(83):before { top: 46.59578644%; left: 76.06646463%; color: #cfafee;
}
.confetti:nth-child(82) { top: 42.84176295%; left: 56.14078164%; color: #f2c5be;
}
.confetti:nth-child(82):after { top: 56.22715299%; left: 16.02706375%; color: #e89ac7;
}
.confetti:nth-child(82):before { top: 33.26894087%; left: 73.26157328%; color: #e1d4f6;
}
.confetti:nth-child(81) { top: 40.57144493%; left: 84.06578384%; color: #9deed4;
}
.confetti:nth-child(81):after { top: 61.74275754%; left: 9.16922625%; color: #f1dcac;
}
.confetti:nth-child(81):before { top: 49.67947327%; left: 34.08741047%; color: #eb9dbe;
}
.confetti:nth-child(80) { top: 45.63181676%; left: 50.28834025%; color: #b9beea;
}
.confetti:nth-child(80):after { top: 38.19425607%; left: 66.96677991%; color: #d5ccda;
}
.confetti:nth-child(80):before { top: 79.1228579%; left: 88.58308776%; color: #b89ddc;
}
.confetti:nth-child(79) { top: 16.73732056%; left: 85.3031089%; color: #f3b5e8;
}
.confetti:nth-child(79):after { top: 54.24364928%; left: 1.79404143%; color: #c7f3e0;
}
.confetti:nth-child(79):before { top: 58.33431267%; left: 26.53078276%; color: #a5d298;
}
.confetti:nth-child(78) { top: 55.84787019%; left: 15.37019001%; color: #b2a999;
}
.confetti:nth-child(78):after { top: 59.76124629%; left: 85.94921414%; color: #d49eaf;
}
.confetti:nth-child(78):before { top: 4.03505869%; left: 32.10690133%; color: #faf0c0;
}
.confetti:nth-child(77) { top: 30.94729983%; left: 81.68826595%; color: #ecb9bb;
}
.confetti:nth-child(77):after { top: 9.04230968%; left: 41.37519598%; color: #e2c4b0;
}
.confetti:nth-child(77):before { top: 48.39331591%; left: 54.52826585%; color: #f5a8a1;
}
.confetti:nth-child(76) { top: 11.70475649%; left: 77.72837827%; color: #d5ffcf;
}
.confetti:nth-child(76):after { top: 84.84747659%; left: 82.26124701%; color: #e0aad7;
}
.confetti:nth-child(76):before { top: 31.7286248%; left: 40.36793004%; color: #a3fcd7;
}
.confetti:nth-child(75) { top: 85.9632199%; left: 25.06076934%; color: #d3b0d7;
}
.confetti:nth-child(75):after { top: 12.24281034%; left: 49.90355589%; color: #abde98;
}
.confetti:nth-child(75):before { top: 12.75288576%; left: 66.00108066%; color: #a1d6a9;
}
.confetti:nth-child(74) { top: 49.37170234%; left: 74.57523785%; color: #9bbaef;
}
.confetti:nth-child(74):after { top: 24.92601386%; left: 52.72342844%; color: #b8f8fd;
}
.confetti:nth-child(74):before { top: 22.37071516%; left: 56.84307499%; color: #bfbfc4;
}
.confetti:nth-child(73) { top: 89.25523662%; left: 66.71183684%; color: #f0d6e9;
}
.confetti:nth-child(73):after { top: 51.24766726%; left: 64.61645725%; color: #f6debd;
}
.confetti:nth-child(73):before { top: 32.00358538%; left: 36.48281811%; color: #d0bfc9;
}
.confetti:nth-child(72) { top: 85.11165349%; left: 54.88686804%; color: #ecf59f;
}
.confetti:nth-child(72):after { top: 60.83723315%; left: 59.56939989%; color: #f4c3e4;
}
.confetti:nth-child(72):before { top: 25.89141062%; left: 86.90798842%; color: #ccbbc7;
}
.confetti:nth-child(71) { top: 5.14357391%; left: 43.58783782%; color: #f7e39d;
}
.confetti:nth-child(71):after { top: 34.79216341%; left: 72.65199751%; color: #d2a696;
}
.confetti:nth-child(71):before { top: 63.28172951%; left: 31.05632687%; color: #dcc39e;
}
.confetti:nth-child(70) { top: 8.38481335%; left: 69.12951465%; color: #ecc2f9;
}
.confetti:nth-child(70):after { top: 46.31737955%; left: 8.47261739%; color: #b9e2cc;
}
.confetti:nth-child(70):before { top: 50.89851041%; left: 68.91794387%; color: #d29ed9;
}
.confetti:nth-child(69) { top: 58.67904308%; left: 34.89068622%; color: #e8cdb9;
}
.confetti:nth-child(69):after { top: 6.17209956%; left: 41.79015695%; color: #eaaaca;
}
.confetti:nth-child(69):before { top: 24.04958664%; left: 86.95684126%; color: #c2a1dd;
}
.confetti:nth-child(68) { top: 57.49567662%; left: 41.66470521%; color: #f7f6b9;
}
.confetti:nth-child(68):after { top: 76.93179398%; left: 8.00135257%; color: #9c9fa0;
}
.confetti:nth-child(68):before { top: 29.29496008%; left: 47.33048036%; color: #fb96ef;
}
.confetti:nth-child(67) { top: 47.65043817%; left: 64.51881279%; color: #bda3e8;
}
.confetti:nth-child(67):after { top: 31.70726943%; left: 8.3311571%; color: #fabad6;
}
.confetti:nth-child(67):before { top: 76.2597043%; left: 32.1394686%; color: #e7dfdc;
}
.confetti:nth-child(66) { top: 75.1972118%; left: 35.35263971%; color: #cfe6c0;
}
.confetti:nth-child(66):after { top: 52.68075873%; left: 50.30116779%; color: #a1b0e9;
}
.confetti:nth-child(66):before { top: 85.11570384%; left: 56.67529762%; color: #98969d;
}
.confetti:nth-child(65) { top: 74.6104983%; left: 75.40949435%; color: #a2b0bb;
}
.confetti:nth-child(65):after { top: 18.79409232%; left: 5.34567982%; color: #ebcf97;
}
.confetti:nth-child(65):before { top: 8.32181159%; left: 83.79547547%; color: #9bcacd;
}
.confetti:nth-child(64) { top: 52.25319768%; left: 11.00392132%; color: #bf9fc9;
}
.confetti:nth-child(64):after { top: 46.71083614%; left: 58.69900892%; color: #c3e3d0;
}
.confetti:nth-child(64):before { top: 77.369949%; left: 81.80868463%; color: #a7f7ae;
}
.confetti:nth-child(63) { top: 14.17433035%; left: 44.43483312%; color: #dfe5bf;
}
.confetti:nth-child(63):after { top: 57.83166586%; left: 46.49529418%; color: #cbafbc;
}
.confetti:nth-child(63):before { top: 26.20023103%; left: 68.49607298%; color: #9aa6f0;
}
.confetti:nth-child(62) { top: 87.12960062%; left: 67.30578504%; color: #e0ddc5;
}
.confetti:nth-child(62):after { top: 60.09002217%; left: 8.70076967%; color: #9abbda;
}
.confetti:nth-child(62):before { top: 63.24222415%; left: 48.78259882%; color: #f1be9e;
}
.confetti:nth-child(61) { top: 38.29856123%; left: 45.03575362%; color: #b2dfe7;
}
.confetti:nth-child(61):after { top: 46.79624566%; left: 70.96626525%; color: #99cfdd;
}
.confetti:nth-child(61):before { top: 4.3418969%; left: 74.52097299%; color: #f6f49b;
}
.confetti:nth-child(60) { top: 43.19225646%; left: 82.15255581%; color: #efc2e8;
}
.confetti:nth-child(60):after { top: 13.33842131%; left: 12.6959425%; color: #acb1f8;
}
.confetti:nth-child(60):before { top: 87.55028226%; left: 40.35598253%; color: #edcdaf;
}
.confetti:nth-child(59) { top: 77.03173062%; left: 76.75087502%; color: #f7e2af;
}
.confetti:nth-child(59):after { top: 13.58922979%; left: 30.5560907%; color: #bdd296;
}
.confetti:nth-child(59):before { top: 67.22919349%; left: 2.48421132%; color: #d7d3f2;
}
.confetti:nth-child(58) { top: 32.90516485%; left: 88.96388998%; color: #bfaaca;
}
.confetti:nth-child(58):after { top: 28.63512179%; left: 52.13578155%; color: #d4c599;
}
.confetti:nth-child(58):before { top: 65.53415428%; left: 48.96921324%; color: #b498a8;
}
.confetti:nth-child(57) { top: 29.0302397%; left: 62.7697843%; color: #ecdbb5;
}
.confetti:nth-child(57):after { top: 78.61964735%; left: 17.72926735%; color: #fef696;
}
.confetti:nth-child(57):before { top: 4.97884545%; left: 26.68348853%; color: #ccdfe6;
}
.confetti:nth-child(56) { top: 18.81659436%; left: 45.50052132%; color: #aba3ce;
}
.confetti:nth-child(56):after { top: 1.05162121%; left: 54.9311502%; color: #bcf0f5;
}
.confetti:nth-child(56):before { top: 34.50279526%; left: 23.53084807%; color: #f9b99e;
}
.confetti:nth-child(55) { top: 57.57599326%; left: 44.69166934%; color: #b3d8cb;
}
.confetti:nth-child(55):after { top: 51.9435184%; left: 11.32858774%; color: #d4ede8;
}
.confetti:nth-child(55):before { top: 28.48946872%; left: 44.62049693%; color: #f3eacc;
}
.confetti:nth-child(54) { top: 27.46372109%; left: 1.37096324%; color: #daf4d6;
}
.confetti:nth-child(54):after { top: 74.69322946%; left: 40.42681638%; color: #ecacd6;
}
.confetti:nth-child(54):before { top: 61.65636998%; left: 69.57504687%; color: #bfaffa;
}
.confetti:nth-child(53) { top: 65.77037001%; left: 83.38833718%; color: #ccd1bb;
}
.confetti:nth-child(53):after { top: 15.59581299%; left: 28.29751336%; color: #ecc1b9;
}
.confetti:nth-child(53):before { top: 23.01528458%; left: 68.36851252%; color: #c5f8f4;
}
.confetti:nth-child(52) { top: 24.62580055%; left: 13.8018563%; color: #ff9ae8;
}
.confetti:nth-child(52):after { top: 49.64391521%; left: 34.30437434%; color: #b296b4;
}
.confetti:nth-child(52):before { top: 64.83049885%; left: 67.85444749%; color: #dd9fb1;
}
.confetti:nth-child(51) { top: 9.94289019%; left: 82.94857556%; color: #b6d3da;
}
.confetti:nth-child(51):after { top: 58.45114756%; left: 59.72969331%; color: #eac7a0;
}
.confetti:nth-child(51):before { top: 82.41699368%; left: 75.34931751%; color: #9acea8;
}
.confetti:nth-child(50) { top: 70.78390901%; left: 36.04173322%; color: #bcbac2;
}
.confetti:nth-child(50):after { top: 53.99914549%; left: 60.74428468%; color: #a0fdfe;
}
.confetti:nth-child(50):before { top: 60.40104122%; left: 38.06310749%; color: #b5f4b5;
}
.confetti:nth-child(49) { top: 10.6036497%; left: 20.41049631%; color: #ebd4f3;
}
.confetti:nth-child(49):after { top: 39.4086616%; left: 87.41507674%; color: #9ea6fe;
}
.confetti:nth-child(49):before { top: 15.74885284%; left: 2.31123204%; color: #eabcbb;
}
.confetti:nth-child(48) { top: 14.8522672%; left: 35.57176824%; color: #a09ff4;
}
.confetti:nth-child(48):after { top: 44.9777161%; left: 51.14806253%; color: #d0e4b5;
}
.confetti:nth-child(48):before { top: 46.27013896%; left: 26.01206986%; color: #a1e6ab;
}
.confetti:nth-child(47) { top: 61.05543863%; left: 49.03601424%; color: #c8d5be;
}
.confetti:nth-child(47):after { top: 54.39715277%; left: 40.48416687%; color: #b6f5d0;
}
.confetti:nth-child(47):before { top: 36.30151224%; left: 26.33113561%; color: #f6c49c;
}
.confetti:nth-child(46) { top: 23.80690735%; left: 30.73270339%; color: #d7bc9f;
}
.confetti:nth-child(46):after { top: 0.15530103%; left: 10.21527038%; color: #b799a6;
}
.confetti:nth-child(46):before { top: 79.37157388%; left: 58.03614262%; color: #daa7d5;
}
.confetti:nth-child(45) { top: 77.4092661%; left: 59.87103066%; color: #aac7f7;
}
.confetti:nth-child(45):after { top: 50.13554733%; left: 82.08927133%; color: #acc2b5;
}
.confetti:nth-child(45):before { top: 46.03170032%; left: 62.48384123%; color: #daeae5;
}
.confetti:nth-child(44) { top: 44.57551775%; left: 80.042862%; color: #b298d9;
}
.confetti:nth-child(44):after { top: 28.04735122%; left: 78.14127633%; color: #a9fecc;
}
.confetti:nth-child(44):before { top: 16.14735045%; left: 86.03067241%; color: #dfcbe4;
}
.confetti:nth-child(43) { top: 33.47752111%; left: 51.93888893%; color: #feade4;
}
.confetti:nth-child(43):after { top: 11.74814652%; left: 49.0082639%; color: #edaae9;
}
.confetti:nth-child(43):before { top: 78.07930521%; left: 84.2439226%; color: #fabdd9;
}
.confetti:nth-child(42) { top: 13.74809561%; left: 34.43363779%; color: #98dfd7;
}
.confetti:nth-child(42):after { top: 27.89496068%; left: 29.37292781%; color: #b2acd0;
}
.confetti:nth-child(42):before { top: 51.34958263%; left: 1.22772041%; color: #eeceb2;
}
.confetti:nth-child(41) { top: 58.44841001%; left: 16.19233967%; color: #eabda3;
}
.confetti:nth-child(41):after { top: 36.54862657%; left: 62.77890245%; color: #e6bcef;
}
.confetti:nth-child(41):before { top: 14.4385622%; left: 47.27567376%; color: #f6d7e1;
}
.confetti:nth-child(40) { top: 31.30555666%; left: 63.82255482%; color: #eed2bc;
}
.confetti:nth-child(40):after { top: 67.55903902%; left: 13.96209406%; color: #99f199;
}
.confetti:nth-child(40):before { top: 72.68151893%; left: 47.00913532%; color: #e1cff4;
}
.confetti:nth-child(39) { top: 11.05638613%; left: 7.19598453%; color: #bcb3e6;
}
.confetti:nth-child(39):after { top: 0.2203651%; left: 20.56703929%; color: #a4abeb;
}
.confetti:nth-child(39):before { top: 53.76000077%; left: 82.1530516%; color: #a6a8d5;
}
.confetti:nth-child(38) { top: 65.05828721%; left: 14.03603374%; color: #f3c4af;
}
.confetti:nth-child(38):after { top: 17.55565136%; left: 78.53135208%; color: #b4cbae;
}
.confetti:nth-child(38):before { top: 52.8128819%; left: 17.81910067%; color: #e9e1c4;
}
.confetti:nth-child(37) { top: 23.70167105%; left: 31.15463926%; color: #bbd3a9;
}
.confetti:nth-child(37):after { top: 59.34458685%; left: 57.24337304%; color: #efe1fb;
}
.confetti:nth-child(37):before { top: 18.28272285%; left: 79.42494119%; color: #bfd4b7;
}
.confetti:nth-child(36) { top: 20.52863281%; left: 53.40731469%; color: #b8b7cc;
}
.confetti:nth-child(36):after { top: 79.87717057%; left: 88.76677052%; color: #f6fab2;
}
.confetti:nth-child(36):before { top: 2.4434737%; left: 45.46821091%; color: #cfd2c4;
}
.confetti:nth-child(35) { top: 48.85830859%; left: 81.99638469%; color: #caece2;
}
.confetti:nth-child(35):after { top: 67.76924219%; left: 55.81531534%; color: #e5d4b9;
}
.confetti:nth-child(35):before { top: 40.3261382%; left: 53.65691859%; color: #a8a3d3;
}
.confetti:nth-child(34) { top: 84.00146398%; left: 12.60802782%; color: #edfdf0;
}
.confetti:nth-child(34):after { top: 1.57075545%; left: 62.35006643%; color: #cff8a8;
}
.confetti:nth-child(34):before { top: 30.8924949%; left: 70.38756365%; color: #f4a7c0;
}
.confetti:nth-child(33) { top: 35.82953827%; left: 79.97048691%; color: #dcfbd4;
}
.confetti:nth-child(33):after { top: 1.1198419%; left: 34.25406953%; color: #adb9d0;
}
.confetti:nth-child(33):before { top: 69.63194051%; left: 56.82243862%; color: #c19dc4;
}
.confetti:nth-child(32) { top: 10.50761869%; left: 1.59788725%; color: #ffd29d;
}
.confetti:nth-child(32):after { top: 65.71619536%; left: 12.97898734%; color: #b8d6b3;
}
.confetti:nth-child(32):before { top: 21.32741326%; left: 56.5716821%; color: #aae3c1;
}
.confetti:nth-child(31) { top: 17.95351436%; left: 64.95615297%; color: #e7f1e7;
}
.confetti:nth-child(31):after { top: 22.54096657%; left: 61.99284384%; color: #9e9cfd;
}
.confetti:nth-child(31):before { top: 16.29810122%; left: 6.26019227%; color: #9997be;
}
.confetti:nth-child(30) { top: 75.5035023%; left: 68.6757362%; color: #aea4d3;
}
.confetti:nth-child(30):after { top: 46.86282792%; left: 19.43572856%; color: #d396f9;
}
.confetti:nth-child(30):before { top: 62.18648326%; left: 5.454695%; color: #dd9bc8;
}
.confetti:nth-child(29) { top: 18.22460569%; left: 81.73305708%; color: #f0b7f7;
}
.confetti:nth-child(29):after { top: 54.29782877%; left: 71.01588346%; color: #fcb697;
}
.confetti:nth-child(29):before { top: 56.36058683%; left: 68.79393463%; color: #eebed4;
}
.confetti:nth-child(28) { top: 23.67794198%; left: 46.87410311%; color: #b9fdf9;
}
.confetti:nth-child(28):after { top: 32.18953736%; left: 63.2201532%; color: #9cd7db;
}
.confetti:nth-child(28):before { top: 46.26219205%; left: 1.11642221%; color: #ced2c3;
}
.confetti:nth-child(27) { top: 72.59599041%; left: 28.65362073%; color: #afb0ff;
}
.confetti:nth-child(27):after { top: 38.26067482%; left: 0.47753647%; color: #d39bd8;
}
.confetti:nth-child(27):before { top: 79.3386957%; left: 15.41657877%; color: #dfc8f4;
}
.confetti:nth-child(26) { top: 18.56896876%; left: 2.24044328%; color: #e7c2c7;
}
.confetti:nth-child(26):after { top: 83.03716804%; left: 1.49737128%; color: #a3a2ff;
}
.confetti:nth-child(26):before { top: 34.11200975%; left: 79.08002581%; color: #bec2cb;
}
.confetti:nth-child(25) { top: 12.48532099%; left: 28.26146807%; color: #daa5d9;
}
.confetti:nth-child(25):after { top: 61.30657868%; left: 81.11633578%; color: #c6e9c0;
}
.confetti:nth-child(25):before { top: 37.7883221%; left: 18.05230699%; color: #ccd2dc;
}
.confetti:nth-child(24) { top: 16.29544917%; left: 43.89661259%; color: #f09a9a;
}
.confetti:nth-child(24):after { top: 63.84037707%; left: 29.56631508%; color: #a7bee3;
}
.confetti:nth-child(24):before { top: 75.7612537%; left: 47.1470198%; color: #afbdf0;
}
.confetti:nth-child(23) { top: 85.99012279%; left: 74.69450125%; color: #ecf6f3;
}
.confetti:nth-child(23):after { top: 27.42880824%; left: 12.13038348%; color: #a9ebf1;
}
.confetti:nth-child(23):before { top: 74.54325159%; left: 47.88280514%; color: #dffcf1;
}
.confetti:nth-child(22) { top: 28.95079034%; left: 79.09035831%; color: #b4b9aa;
}
.confetti:nth-child(22):after { top: 42.33775316%; left: 54.24606329%; color: #acafb9;
}
.confetti:nth-child(22):before { top: 34.77067051%; left: 67.88161418%; color: #ececd6;
}
.confetti:nth-child(21) { top: 32.52870713%; left: 51.00301409%; color: #d8ebdb;
}
.confetti:nth-child(21):after { top: 83.24096136%; left: 5.43034625%; color: #9cdfcb;
}
.confetti:nth-child(21):before { top: 65.62422937%; left: 74.66446229%; color: #fdb3d3;
}
.confetti:nth-child(20) { top: 13.57022423%; left: 56.6256058%; color: #f5caa7;
}
.confetti:nth-child(20):after { top: 18.51940437%; left: 88.54534642%; color: #c3bab7;
}
.confetti:nth-child(20):before { top: 46.24163866%; left: 71.23752212%; color: #aea6d7;
}
.confetti:nth-child(19) { top: 10.79405932%; left: 17.08765295%; color: #98a0a9;
}
.confetti:nth-child(19):after { top: 63.97810957%; left: 78.98755041%; color: #e7b1e0;
}
.confetti:nth-child(19):before { top: 12.31866441%; left: 88.60176287%; color: #dfd8e6;
}
.confetti:nth-child(18) { top: 81.07066325%; left: 16.93776935%; color: #b0b5bd;
}
.confetti:nth-child(18):after { top: 73.88149666%; left: 71.23736205%; color: #b7c8a0;
}
.confetti:nth-child(18):before { top: 58.18189665%; left: 53.17243057%; color: #a2f3aa;
}
.confetti:nth-child(17) { top: 36.80478539%; left: 27.01526211%; color: #f7feba;
}
.confetti:nth-child(17):after { top: 17.64405837%; left: 70.72554382%; color: #cdf1d7;
}
.confetti:nth-child(17):before { top: 62.08021875%; left: 70.95477762%; color: #d6f2fd;
}
.confetti:nth-child(16) { top: 88.92996467%; left: 48.28548667%; color: #bbe39a;
}
.confetti:nth-child(16):after { top: 43.74205543%; left: 65.77425861%; color: #ecb3fa;
}
.confetti:nth-child(16):before { top: 84.93680697%; left: 81.69904139%; color: #a9e2e0;
}
.confetti:nth-child(15) { top: 54.41247636%; left: 35.7673385%; color: #b4e999;
}
.confetti:nth-child(15):after { top: 17.4148828%; left: 68.00531808%; color: #cdf7b8;
}
.confetti:nth-child(15):before { top: 60.60463467%; left: 86.21806844%; color: #ccbec6;
}
.confetti:nth-child(14) { top: 13.97862747%; left: 36.22834175%; color: #d5f3e7;
}
.confetti:nth-child(14):after { top: 39.80228323%; left: 80.80105839%; color: #a2a9d5;
}
.confetti:nth-child(14):before { top: 19.70641001%; left: 72.23359763%; color: #d6e8a0;
}
.confetti:nth-child(13) { top: 8.41999192%; left: 68.31962365%; color: #caada6;
}
.confetti:nth-child(13):after { top: 26.20869636%; left: 32.02763633%; color: #9ca5fb;
}
.confetti:nth-child(13):before { top: 62.6983748%; left: 61.55129077%; color: #f4fafe;
}
.confetti:nth-child(12) { top: 64.52506605%; left: 31.47567646%; color: #d3f5e1;
}
.confetti:nth-child(12):after { top: 58.7682891%; left: 20.98752063%; color: #cbbbfd;
}
.confetti:nth-child(12):before { top: 34.74842787%; left: 47.41115591%; color: #f9c89e;
}
.confetti:nth-child(11) { top: 4.90142358%; left: 0.24727226%; color: #cecde0;
}
.confetti:nth-child(11):after { top: 79.50352448%; left: 18.53352754%; color: #f898dd;
}
.confetti:nth-child(11):before { top: 9.22959997%; left: 86.90423425%; color: #daffa0;
}
.confetti:nth-child(10) { top: 3.12645405%; left: 31.31744932%; color: #e5e8de;
}
.confetti:nth-child(10):after { top: 80.06747469%; left: 24.70314381%; color: #99e1e8;
}
.confetti:nth-child(10):before { top: 43.09500216%; left: 31.68217782%; color: #9cb6c1;
}
.confetti:nth-child(9) { top: 23.93771644%; left: 30.74785125%; color: #dab2e9;
}
.confetti:nth-child(9):after { top: 78.2025264%; left: 62.5360126%; color: #aaf29e;
}
.confetti:nth-child(9):before { top: 3.94385369%; left: 79.18327143%; color: #f7a9dc;
}
.confetti:nth-child(8) { top: 83.10420725%; left: 46.16771769%; color: #a098dc;
}
.confetti:nth-child(8):after { top: 57.31698798%; left: 37.99025748%; color: #e1eaec;
}
.confetti:nth-child(8):before { top: 44.47600752%; left: 11.62958515%; color: #ecf5b1;
}
.confetti:nth-child(7) { top: 18.9310341%; left: 61.77847348%; color: #a5fdd1;
}
.confetti:nth-child(7):after { top: 35.17184694%; left: 13.38961686%; color: #c9a0a6;
}
.confetti:nth-child(7):before { top: 57.77289805%; left: 55.85643291%; color: #fce6ce;
}
.confetti:nth-child(6) { top: 85.9093576%; left: 41.71752428%; color: #c6edfd;
}
.confetti:nth-child(6):after { top: 31.0179344%; left: 3.47836524%; color: #dedfd0;
}
.confetti:nth-child(6):before { top: 27.60276435%; left: 63.75924186%; color: #a7e5e7;
}
.confetti:nth-child(5) { top: 18.52474041%; left: 21.88495589%; color: #b6b6d2;
}
.confetti:nth-child(5):after { top: 62.29856424%; left: 46.57996557%; color: #d2d5e7;
}
.confetti:nth-child(5):before { top: 55.90596506%; left: 81.62436%; color: #afafa3;
}
.confetti:nth-child(4) { top: 74.97008234%; left: 89.01667525%; color: #fcd0c6;
}
.confetti:nth-child(4):after { top: 78.89098522%; left: 39.46691121%; color: #cdb5fe;
}
.confetti:nth-child(4):before { top: 69.78075718%; left: 41.73556903%; color: #febbe4;
}
.confetti:nth-child(3) { top: 21.91200377%; left: 58.58913416%; color: #b9dee1;
}
.confetti:nth-child(3):after { top: 52.74566586%; left: 76.61367433%; color: #b9abaa;
}
.confetti:nth-child(3):before { top: 76.45955052%; left: 36.96092671%; color: #e0cfc9;
}
.confetti:nth-child(2) { top: 34.60378416%; left: 10.00788946%; color: #f2a4c8;
}
.confetti:nth-child(2):after { top: 37.60265487%; left: 7.43494121%; color: #b7dccf;
}
.confetti:nth-child(2):before { top: 53.12746025%; left: 25.73243547%; color: #97aed9;
}
.confetti:nth-child(1) { top: 52.40035974%; left: 49.33160417%; color: #f2a9ae;
}
.confetti:nth-child(1):after { top: 7.09682852%; left: 52.89142391%; color: #eeebd8;
}
.confetti:nth-child(1):before { top: 74.2346973%; left: 75.75009049%; color: #baa69b;
}

Home Page	Home
Developer	Nick Colley
Username	nickcolley
Uploaded	November 12, 2022
Rating	3
Size	18,585 Kb
Views	6,072

Do you need developer help for A Pen by Nick Colley?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Nick Colley (nickcolley) Script Codes

Name	Size
Wip elementary os navbar	2,993 Kb
Subtle Animation Example	2,101 Kb
Centered Text in a Perfect Circle	2,410 Kb
Linux Install Terminal	2,259 Kb
One element icon	1,976 Kb
Custom Soundcloud Player	3,033 Kb
Close animation	2,207 Kb
Erno	5,311 Kb
Subtle Quote	3,379 Kb
Brightness regulation UI design	2,713 Kb

Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!

Similar Scripts & Codes

Name	Username	Size
Two tables and header with jspdf-autotable	Someatoms	2,245 Kb
Parallax-ish Sliding Content	Jdsteinbach	2,748 Kb
Swiftype Lower Third	Zumwalt	4,796 Kb
Subtle site navigation with description	Necks	3,206 Kb
Super Discount	Orrinward	3,225 Kb
Animated skewed panes	NyX	4,462 Kb
RAQuote	Naderk007	4,412 Kb
Slick Slider	Wearebold	5,913 Kb
Tree growth tests	Orchard	3,818 Kb
Prism	Pyrografix	2,843 Kb

Do you want hide your ip address?

Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!