The latest articles on Forem by Abel Moremi (@abelmoremi). https://forem.com/abelmoremi https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F253199%2F8dd52434-9303-46f8-ad0b-847f1ea7c606.jpg https://forem.com/abelmoremi en Abel Moremi Wed, 03 Jun 2020 22:14:31 +0000 https://forem.com/abelmoremi/made-a-meme-with-css-2kcl https://forem.com/abelmoremi/made-a-meme-with-css-2kcl <h2> HOW IT STARTED </h2> <p>So a while back I made my first CSS Illustration to refresh, before starting a new project. I showed it to a friend and he suggested that I should make a meme with CSS 🧠 (big brain thinking😂). I honestly wished it was my idea...🔥🔥 But its mine now... Took the red pill. The final product is made purely with just HTML + CSS... and yes including the animation... CSS is 🔥🔥.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--78Jyv-IZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ecbnab5zz8nhzscp760a.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--78Jyv-IZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ecbnab5zz8nhzscp760a.png" alt="self CSS protrait"></a><br> <a href="https://codepen.io/abel-moremi/full/GRpOxdV">codepen of my first CSS Illustration</a><br> <br></p> <h2> EXPLAINED THROUGH THE POWER OF MEMES </h2> <p>A short story presented purely with memes... like with all great art, its meant to be interpreted as you see fit...😂🤣<br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--2wFgQj7M--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/k6kbp8z1xftgpeu3pb2q.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--2wFgQj7M--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/k6kbp8z1xftgpeu3pb2q.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--YFfTvJzq--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/158q2kat1lq3vw58pl3k.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--YFfTvJzq--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/158q2kat1lq3vw58pl3k.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--dM9aGUxi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/u9ug90gjuwyjddc6cmko.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--dM9aGUxi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/u9ug90gjuwyjddc6cmko.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--CnollizQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/djkjbgkfj0qtpx9bs31a.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--CnollizQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/djkjbgkfj0qtpx9bs31a.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Y0EH1mMX--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/x7oh5zj4nmoa1euhk3gk.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Y0EH1mMX--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/x7oh5zj4nmoa1euhk3gk.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--4CXLhh_j--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/khxddkndoosgvfpg0beu.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--4CXLhh_j--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/khxddkndoosgvfpg0beu.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--0JZX9RBy--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/bahrt2g7biiyzzczmbn1.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--0JZX9RBy--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/bahrt2g7biiyzzczmbn1.jpg" alt="Alt Text"></a><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--twfTEt5G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/xqrc1oj9xkpi5pjlk1qy.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--twfTEt5G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/xqrc1oj9xkpi5pjlk1qy.jpg" alt="Alt Text"></a></p> <h2> THE FINAL PRODUCT </h2> <p>Also... NO JavaScript was harmed in the making of this MEME😎😘<br> <br><br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Y5QJloGp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/qra7t6tk7x5ls9ingy0l.gif" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Y5QJloGp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/qra7t6tk7x5ls9ingy0l.gif" alt="Alt Text"></a><br> <a href="https://codepen.io/abel-moremi/full/rNOZzjX">codepen</a></p> <p>Ofcourse its a programming meme... THink of it as an inception meme 🧠 (A meme about the very thing its made off🔥🔥🔥 code...)</p> <p>It was fun making this... Enjoy</p> meme purecss 100daysofcode illustration