UNPKG

js-easter-egg-pack

Version:
1,083 lines (743 loc) โ€ข 20.6 kB
# ๐Ÿฐ Easter-Egg-Pack <p align="center"> <a target="_blank" href="https://github.com/MandipKumarKanu/js-easter-egg-pack"> <img width="200" alt="js-easter-egg-pack" src="https://i.ibb.co/FqDzF3L1/easter-egg.png"> </a> </p> <p align="center">Now just start typing and discover the magic! โœจ๐Ÿฃ</p> <p align="center"> <a target="_blank" href="https://nodei.co/npm/js-easter-egg-pack" title="NPM"><img src="https://nodei.co/npm/js-easter-egg-pack.png?downloads=true&downloadRank=true&stars=true"></a> </p> ## ๐Ÿ’ก Inspiration Original Source: Thanks to [Richard Denton](https://codepen.io/isdampe/pen/OXYZZO)! All of the images were derived from [GIPHY](https://giphy.com/). ## ๐Ÿ“– Documentation with Live Demo ๐Ÿค˜ [Just have fun](https://easter-eggs-2029.web.app/) ( <b>Easter eggs can be triggered in this documentation</b> ) ! Or... [website](https://easter-eggs-2029.web.app/) for live example ! ## ๐ŸŽ‰ Installation In a browser (CDN): using npm: ```shell npm i js-easter-egg-pack --save-dev ``` Then in your JavaScript file: ```javascript import collection from "js-easter-egg-pack"; ``` Everything all done now! <img src="https://i.ibb.co/7mqMhYW/3e2cfee2eb4ed31f4325598ee53ece71.gif" width="50" height="auto"> <p align="center"> <a target="_blank" href="https://github.com/MandipKumarKanu/js-easter-egg-pack"> <img alt="easter-egg-pack" src="https://i.ibb.co/1f5McyH7/Untitled.png"> </a> </p> ### Features: โœ”๏ธ Automatically detects inputs and textareas with `data-easter` โœ”๏ธ Easy to useโ€”just add `data-easter` to any input field! --- ### Trigger Easter Eggs with `data-easter` You can now trigger hidden easter eggs simply by adding the `data-easter` attribute to any text input or textarea. ```html <input type="text" placeholder="Type here..." data-easter /> <textarea placeholder="Type something..." data-easter></textarea> ``` --- ## โšก๏ธ Quick Start #### hi > Set your goals high, and don't stop till you get there ๐Ÿ‘‹ ```html <!-- There's no need to open console --> <!-- Just type 'hi' in your browser --> hi ``` <p align="center"> <img alt="Hi" style="display: none; margin: 0 auto;" src="https://i.ibb.co/KxC5LzSB/gOuUuKp.gif"> </p> --- #### wink > Wink and shut their apprehensions up ๐Ÿ˜œ ```html <!-- There's no need to open console --> <!-- Just type 'wink' in your browser --> wink ``` <p align="center"> <img alt="Wink" style="display: none; margin: 0 auto;" src="https://i.ibb.co/y9vRhT3/N4mPiWW.gif"> </p> --- #### unicorn > I wish I were a unicorn, so I could stab idiots with my head ๐Ÿฆ„ ```html <!-- There's no need to open console --> <!-- Just type 'unicorn' in your browser --> unicorn ``` <p align="center"> <img alt="Unicorn" style="display: none; margin: 0 auto;" src="https://i.ibb.co/3mqZ2C2N/ZEVcTFq.gif"> </p> --- #### kumamon > But people who really know me, know that I am not a bad boy at heart... I am a big teddy bear ๐Ÿป ```html <!-- There's no need to open console --> <!-- Just type 'kumamon' in your browser --> kumamon ``` <p align="center"> <img alt="Kumamon" style="display: none; margin: 0 auto;" src="https://i.imgur.com/yzM5z1R.gif"> </p> --- #### haha > Behind every great man is a woman rolling her eyes โ˜บ๏ธ ```html <!-- There's no need to open console --> <!-- Just type 'haha' in your browser --> haha ``` <p align="center"> <img alt="Haha" style="display: none; margin: 0 auto;" src="https://i.imgur.com/n8CnIt2.gif"> </p> --- #### travel > Wherever you go, go with all your heart ๐ŸŒ‡ ```html <!-- There's no need to open console --> <!-- Just type 'travel' in your browser --> travel ``` <p align="center"> <img alt="Travel" style="display: none; margin: 0 auto;" src="https://i.imgur.com/Rhm6vpg.gif"> </p> --- #### bat > You gotta keep the ball off the fat part of the bat โšฐ ```html <!-- There's no need to open console --> <!-- Just type 'bat' in your browser --> bat ``` <p align="center"> <img alt="Bat" style="display: none; margin: 0 auto;" src="https://i.imgur.com/sOBEbn0.gif"> </p> --- #### robot > We're fascinated with robots because they are reflections of ourselves ๐Ÿค– ```html <!-- There's no need to open console --> <!-- Just type 'robot' in your browser --> robot ``` <p align="center"> <img alt="Robot" style="display: none; margin: 0 auto;" src="https://i.imgur.com/tBge8mr.gif"> </p> --- #### hiphop > That's what hip-hop is: It's sociology and English put to a beat, you know ๐ŸŽถ ```html <!-- There's no need to open console --> <!-- Just type 'hiphop' in your browser --> hiphop ``` <p align="center"> <img alt="Hiphop" style="display: none; margin: 0 auto;" src="https://i.imgur.com/JUHDJ0s.gif"> </p> --- #### hippo > You Deserve A Hippo Today ๐Ÿ˜Ž ```html <!-- There's no need to open console --> <!-- Just type 'hippo' in your browser --> hippo ``` <p align="center"> <img alt="Hippo" style="display: none; margin: 0 auto;" src="https://i.imgur.com/zz9G7i6.gif"> </p> --- #### pokeball > Keep Calm And Go ๐Ÿš€ ```html <!-- There's no need to open console --> <!-- Just type 'pokeball' in your browser --> pokeball ``` <p align="center"> <img alt="Pokeball" style="display: none; margin: 0 auto;" src="https://i.imgur.com/zUErX2s.gif"> </p> --- #### pie > So the pie isn't perfect? Cut it into wedges. Stay in control, and never panic ๐Ÿ• ```html <!-- There's no need to open console --> <!-- Just type 'pie' in your browser --> pie ``` <p align="center"> <img alt="Pie" style="display: none; margin: 0 auto;" src="https://i.imgur.com/YnR31FU.gif"> </p> --- #### ufo > From 1961 to 1965 Barney and I had not seen another UFO ๐Ÿ‘ฝ ```html <!-- There's no need to open console --> <!-- Just type 'ufo' in your browser --> ufo ``` <p align="center"> <img alt="Ufo" style="display: none; margin: 0 auto;" src="https://i.imgur.com/AkFfIv8.gif"> </p> --- #### walk > I am a slow walker, but I never walk back ๐Ÿšถ ```html <!-- There's no need to open console --> <!-- Just type 'walk' in your browser --> walk ``` <p align="center"> <img alt="Walk" style="display: none; margin: 0 auto;" src="https://i.imgur.com/6EvNP6y.gif"> </p> --- #### cool > My key to dealing with stress is simple: just stay cool and stay focused ๐Ÿ˜Ž ```html <!-- There's no need to open console --> <!-- Just type 'cool' in your browser --> cool ``` <p align="center"> <img alt="Cool" style="display: none; margin: 0 auto;" src="https://i.imgur.com/g0QSLmj.gif"> </p> --- #### balloon > What is success? It is a toy balloon among children armed with pins ๐ŸŽˆ ```html <!-- There's no need to open console --> <!-- Just type 'balloon' in your browser --> balloon ``` <p align="center"> <img alt="Balloon" style="display: none; margin: 0 auto;" src="https://i.imgur.com/4bOyiF2.gif"> </p> --- #### hangover > What in the world is a hangover cure? ๐Ÿท ```html <!-- There's no need to open console --> <!-- Just type 'hangover' in your browser --> hangover ``` <p align="center"> <img alt="Hangover" style="display: none; margin: 0 auto;" src="https://i.imgur.com/0IXYKXg.gif"> </p> --- #### kirby > "This grass feels funny," Kirby thought. "It feels like... pants." เผผ ใค โ—•_โ—• เผฝใค ```html <!-- There's no need to open console --> <!-- Just type 'kirby' in your browser --> kirby ``` <p align="center"> <img alt="Kirby" style="display: none; margin: 0 auto;" src="https://i.imgur.com/DnFQ1Gp.gif"> </p> --- #### no > No smoking ๐Ÿšฌ ```html <!-- There's no need to open console --> <!-- Just type 'no' in your browser --> no ``` <p align="center"> <img alt="No" style="display: none; margin: 0 auto;" src="https://i.imgur.com/lZK6DiW.gif"> </p> --- #### onmyway > Stressed? Why not walk it off ๐Ÿšถ ```html <!-- There's no need to open console --> <!-- Just type 'onmyway' in your browser --> onmyway ``` <p align="center"> <img alt="Onmyway" style="display: none; margin: 0 auto;" src="https://i.imgur.com/q0A5FzR.gif"> </p> --- #### haters > When there's so many haters and negative things, I really don't care ๐Ÿค” ```html <!-- There's no need to open console --> <!-- Just type 'haters' in your browser --> haters ``` <p align="center"> <img alt="Haters" style="display: none; margin: 0 auto;" src="https://i.imgur.com/plKHiwS.gif"> </p> --- #### board > Skate or die ๐Ÿ‘พ ```html <!-- There's no need to open console --> <!-- Just type 'board' in your browser --> board ``` <p align="center"> <img alt="Board" style="display: none; margin: 0 auto;" src="https://i.imgur.com/ewNWDS9.gif"> </p> --- #### snorlax > Just do it, later ๐Ÿ˜† ```html <!-- There's no need to open console --> <!-- Just type 'snorlax' in your browser --> snorlax ``` <p align="center"> <img alt="Snorlax" style="display: none; margin: 0 auto;" src="https://i.imgur.com/ABegxEv.gif"> </p> --- #### fly > I can't stop moving. I'm like this weird insect. I can't sit still in real life ๐Ÿ› ```html <!-- There's no need to open console --> <!-- Just type 'fly' in your browser --> fly ``` <p align="center"> <img alt="Fly" style="display: none; margin: 0 auto;" src="https://i.imgur.com/ggWk17I.gif"> </p> --- #### earth > Save earth to save life ๐ŸŒŽ ```html <!-- There's no need to open console --> <!-- Just type 'earth' in your browser --> earth ``` <p align="center"> <img alt="Earth" style="display: none; margin: 0 auto;" src="https://i.imgur.com/lu11Vnk.gif"> </p> --- #### thankyou > You can do anything, but not everything ๐Ÿ™ ```html <!-- There's no need to open console --> <!-- Just type 'thankyou' in your browser --> thankyou ``` <p align="center"> <img alt="Thank You" style="display: none; margin: 0 auto;" src="https://i.imgur.com/PXVdtZG.gif"> </p> --- #### swim > H2O = 2 parts heart, one part obsession ๐ŸŠ ```html <!-- There's no need to open console --> <!-- Just type 'swim' in your browser --> swim ``` <p align="center"> <img alt="Swim" style="display: none; margin: 0 auto;" src="https://i.imgur.com/7CKafBS.gif"> </p> --- #### penguin > Easy, breezy, beautiful penguin ๐Ÿง ```html <!-- There's no need to open console --> <!-- Just type 'penguin' in your browser --> penguin ``` <p align="center"> <img alt="Penguin" style="display: none; margin: 0 auto;" src="https://i.imgur.com/PFT49WH.gif"> </p> --- #### handsome > I'm a handsome man with a charming personality ๐Ÿ˜Ž ```html <!-- There's no need to open console --> <!-- Just type 'handsome' in your browser --> handsome ``` <p align="center"> <img alt="Handsome" style="display: none; margin: 0 auto;" src="https://i.imgur.com/pA30jqZ.gif"> </p> --- #### winner > Without losers, where would the winners be? ๐Ÿ† ```html <!-- There's no need to open console --> <!-- Just type 'winner' in your browser --> winner ``` <p align="center"> <img alt="Winner" style="display: none; margin: 0 auto;" src="https://i.imgur.com/aFJFC6W.gif"> </p> --- #### tank > If the tanks succeed, then victory follows โคต ```html <!-- There's no need to open console --> <!-- Just type 'tank' in your browser --> tank ``` <p align="center"> <img alt="Tank" style="display: none; margin: 0 auto;" src="https://i.imgur.com/6i9GRUQ.gif"> </p> --- #### jump > The only exercise I excel at is jumping to conclusions ๐Ÿ ```html <!-- There's no need to open console --> <!-- Just type 'jump' in your browser --> jump ``` <p align="center"> <img alt="Jump" style="display: none; margin: 0 auto;" src="https://i.ibb.co/jPg5XrDY/4e3fd47366a1a78101b4e161bbd12f25.gif"> </p> --- #### fox > The fox changes his fur but not his habits ๐Ÿบ ```html <!-- There's no need to open console --> <!-- Just type 'fox' in your browser --> fox ``` <p align="center"> <img alt="Fox" style="display: none; margin: 0 auto;" src="https://i.imgur.com/OpdJKaM.gif"> </p> --- #### mario > Life is a game, kid! It all depends on how you play! ๐ŸŽฎ ```html <!-- There's no need to open console --> <!-- Just type 'mario' in your browser --> mario ``` <p align="center"> <img alt="Mario" style="display: none; margin: 0 auto;" src="https://i.imgur.com/entKupA.gif"> </p> --- #### joker > I can't wait to show you my toys ๐Ÿƒ ```html <!-- There's no need to open console --> <!-- Just type 'joker' in your browser --> joker ``` <p align="center"> <img alt="Joker" style="display: none; margin: 0 auto;" src="https://i.imgur.com/XYq7GTX.gif"> </p> --- #### rabbit > Maybe She's Born With It, Maybe It's Rabbit ๐Ÿ‡ ```html <!-- There's no need to open console --> <!-- Just type 'rabbit' in your browser --> rabbit ``` <p align="center"> <img alt="Rabbit" style="display: none; margin: 0 auto;" src="https://i.imgur.com/RlFylRn.gif"> </p> #### sensei > wa ka ri ma shi ta ๐Ÿซ ```html <!-- There's no need to open console --> <!-- Just type 'sensei' in your browser --> sensei ``` <p align="center"> <img alt="Sensei" style="display: none; margin: 0 auto;" src="https://i.imgur.com/FWQgtO9.gif"> </p> #### piggy > Here comes wild boar knight ๐Ÿท ```html <!-- There's no need to open console --> <!-- Just type 'piggy' in your browser --> piggy ``` <p align="center"> <img alt="Piggy" style="display: none; margin: 0 auto;" src="https://i.imgur.com/RZGnd1b.gif"> </p> --- #### psyduck > Psyduck with Big Bang ๐Ÿ’ฃ ```html <!-- There's no need to open console --> <!-- Just type 'psyduck' in your browser --> psyduck ``` <p align="center"> <img alt="Psyduck" style="display: none; margin: 0 auto;" src="https://i.imgur.com/Djl4oID.gif"> </p> #### dragon > If you can't take the heat, don't tickle the dragon ```html <!-- There's no need to open console --> <!-- Just type 'dragon' in your browser --> dragon ``` <p align="center"> <img alt="Dragon" style="display: none; margin: 0 auto;" src="https://i.imgur.com/jUlebex.gif"> </p> --- #### salamander > Are salamanders dangerous to humans? ```html <!-- There's no need to open console --> <!-- Just type 'salamander' in your browser --> salamander ``` <p align="center"> <img alt="Salamander" style="display: none; margin: 0 auto;" src="https://i.imgur.com/QEkFN7W.gif"> </p> --- #### airguitar > Just be like a guitar hero dude ```html <!-- There's no need to open console --> <!-- Just type 'airguitar' in your browser --> airguitar ``` <p align="center"> <img alt="Airguitar" style="display: none; margin: 0 auto;" src="https://i.imgur.com/JSgV7v5.gif"> </p> --- #### pikachu > A pikachu will show up from the bottom with ligntning sound ```html <!-- There's no need to open console --> <!-- Just type 'pikachu' in your browser --> pikachu ``` <p align="center"> <img alt="Pikachu" style="display: none; margin: 0 auto;" src="https://i.imgur.com/HsnDIk0.gif"> </p> --- #### bravo > A man's clapping with funny smile ```html <!-- There's no need to open console --> <!-- Just type 'bravo' in your browser --> bravo ``` <p align="center"> <img alt="Bravo" style="display: none; margin: 0 auto;" src="https://i.imgur.com/7UehQva.gif"> </p> --- #### ghost > A ghost's floating from the right to the left ```html <!-- There's no need to open console --> <!-- Just type 'ghost' in your browser --> ghost ``` <p align="center"> <img alt="Ghost" style="display: none; margin: 0 auto;" src="https://i.imgur.com/olm7u2x.gif"> </p> --- #### britney > A beauty called Britney will blink at you ```html <!-- There's no need to open console --> <!-- Just type 'britney' in your browser --> britney ``` <p align="center"> <img alt="Britney" style="display: none; margin: 0 auto;" src="https://i.imgur.com/DvwoNWS.gif"> </p> --- #### pikarun > A lovely pikachu's running like a flash ```html <!-- There's no need to open console --> <!-- Just type 'pikarun' in your browser --> pikarun ``` <p align="center"> <img alt="Pikarun" style="display: none; margin: 0 auto;" src="https://i.imgur.com/CX6WuNh.gif"> </p> --- #### catrun > I love cat, so let the cat out ```html <!-- There's no need to open console --> <!-- Just type 'catrun' in your browser --> catrun ``` <p align="center"> <img alt="Catrun" style="display: none; margin: 0 auto;" src="https://i.imgur.com/fMu33z0.gif"> </p> --- #### koggy > No koggy, no happiness ```html <!-- There's no need to open console --> <!-- Just type 'koggy' in your browser --> koggy ``` <p align="center"> <img alt="Koggy" style="display: none; margin: 0 auto;" src="https://i.imgur.com/OWPt85z.gif"> </p> --- #### sonic > Classic Super Sonic with vivid animation ```html <!-- There's no need to open console --> <!-- Just type 'sonic' in your browser --> sonic ``` <p align="center"> <img alt="Sonic" style="display: none; margin: 0 auto;" src="https://i.imgur.com/zrqaPGm.gif"> </p> --- #### doggy > Classic Super Doggy with vivid animation ```html <!-- There's no need to open console --> <!-- Just type 'doggy' in your browser --> doggy ``` <p align="center"> <img alt="Doggy" style="display: none; margin: 0 auto;" src="https://i.imgur.com/aE3wMr6.gif"> </p> --- #### spongebob > Spongebob is your best friend ```html <!-- There's no need to open console --> <!-- Just type 'spongebob' in your browser --> spongebob ``` <p align="center"> <img alt="Spongebob" style="display: none; margin: 0 auto;" src="https://i.imgur.com/gmGfyce.gif"> </p> --- #### gun > Where is your gun? ```html <!-- There's no need to open console --> <!-- Just type 'gun' in your browser --> gun ``` <p align="center"> <img alt="Gun" style="display: none; margin: 0 auto;" src="https://i.imgur.com/cz8iq8n.gif"> </p> --- #### money > Pay money to my pain ```html <!-- There's no need to open console --> <!-- Just type 'money' in your browser --> money ``` <p align="center"> <img alt="Money" style="display: none; margin: 0 auto;" src="https://i.imgur.com/Q2W7OXx.gif"> </p> --- #### homer > Wise man Homer ```html <!-- There's no need to open console --> <!-- Just type 'homer' in your browser --> homer ``` <p align="center"> <img alt="Homer" style="display: none; margin: 0 auto;" src="https://i.imgur.com/fzJcnSD.gif"> </p> --- #### dog > Dogs are human best friends ```html <!-- There's no need to open console --> <!-- Just type 'dog' in your browser --> dog ``` <p align="center"> <img alt="Dog" style="display: none; margin: 0 auto;" src="https://i.imgur.com/QDi8sbM.gif"> </p> --- #### bird > Stupid birds fly slowly ```html <!-- There's no need to open console --> <!-- Just type 'bird' in your browser --> bird ``` <p align="center"> <img alt="Bird" style="display: none; margin: 0 auto;" src="https://i.imgur.com/aAsrMKo.gif"> </p> --- #### piqiu > A piqiu a day keeps worries away ```html <!-- There's no need to open console --> <!-- Just type 'piqiu' in your browser --> piqiu ``` <p align="center"> <img alt="Piqiu" style="display: none; margin: 0 auto;" src="https://i.imgur.com/3OVA8hx.gif"> </p> --- #### lol > Haha, you're funny ```html <!-- There's no need to open console --> <!-- Just type 'lol' in your browser --> lol ``` <p align="center"> <img alt="Lol" style="display: none; margin: 0 auto;" src="https://i.imgur.com/JzT4AaR.gif"> </p> --- #### ohhh > Mordecai & Rigby with OHHHHHHHHHHHHHH sound ```html <!-- There's no need to open console --> <!-- Just type 'ohhh' in your browser --> Ohhh ``` <p align="center"> <img alt="Ohhh" style="display: none; margin: 0 auto;" src="https://i.imgur.com/3f70bsr.gif"> </p> --- #### nyancat > Nyan nyan nyan nyan nyan nyan nyan nyan ```html <!-- There's no need to open console --> <!-- Just type 'nyancat' in your browser --> nyancat ``` <p align="center"> <img alt="Nyancat" style="display: none; margin: 0 auto;" src="https://i.imgur.com/WcTBXUW.gif"> </p> #### naruto > Summon Naruto ```html <!-- There's no need to open console --> <!-- Just type 'naruto' in your browser --> naruto ``` <p align="center"> <img alt="naruto" style="display: none; margin: 0 auto;" src="https://i.ibb.co/ksS692xv/96bd57dfd46d27a32d435ad8eb82a997.gif"> </p> #### itachi > Summon Itachi ```html <!-- There's no need to open console --> <!-- Just type 'itachi' in your browser --> itachi ``` <p align="center"> <img alt="itachi" style="display: none; margin: 0 auto;" src="https://i.ibb.co/qM1dnQG2/2f006a4527ed1dfd886558bf8a7123f0.gif"> </p> #### dance > Summon Naruto dancing ```html <!-- There's no need to open console --> <!-- Just type 'dance' in your browser --> dance ``` <p align="center"> <img alt="dance" style="display: none; margin: 0 auto;" src="https://i.ibb.co/h1dMwc3y/e884990a7863c90811e37b275cae3f0c.gif"> </p> > Set your goals high, and don't stop till you get there! ๐Ÿ‘‹