A responsive animated radar scanner using CSS gradients.
A Pen by George W. Park on CodePen.
ardejorge66
🌶️
ardejorge66
/ css-gradient-radar-scanner.markdown
Created
April 17, 2023 16:34
CSS Gradient Radar Scanner
ardejorge66
/ css-open-store-animation.markdown
Created
January 24, 2024 18:38
CSS open store animation
Loading Animation when opening a store online, 22k weight.
A Pen by Mariana Beldi on CodePen.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <main> | |
| <ul class='slider'> | |
| <li class='item' style="background-image: url('https://cdn.mos.cms.futurecdn.net/dP3N4qnEZ4tCTCLq59iysd.jpg')"> | |
| <div class='content'> | |
| <h2 class='title'>"Lossless Youths"</h2> | |
| <p class='description'> Lorem ipsum, dolor sit amet consectetur | |
| adipisicing elit. Tempore fuga voluptatum, iure corporis inventore | |
| praesentium nisi. Id laboriosam ipsam enim. </p> | |
| <button>Read More</button> | |
| </div> |
ardejorge66
/ digibrady-portfolio-static-single-page-app.markdown
Created
April 16, 2024 15:03
DigiBrady Portfolio Static Single Page App
A portfolio single page web application (SPA). It uses Bootstrap for the layout. An attempt was made to make the CSS as simple as possible.
This SPA will support http://www.digibrady.com
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="root"></div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <body> | |
| <header class="header-section-main"> | |
| <div class="cursor"></div> | |
| <div class="custom-container"> | |
| <div class="header-section-inner"> | |
| <div class="header-logo"> | |
| <a href="javascript:void(0);"> | |
| <img src="https://www.yudiz.com/codepen/valorant-characters/valorant.svg" class="cursor-scale small" alt="valorant-logo" /> | |
| </a> | |
| </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- Game canvas --> | |
| <canvas id="c"></canvas> | |
| <!-- Gameplay HUD --> | |
| <div class="hud"> | |
| <div class="hud__score"> | |
| <div class="score-lbl"></div> | |
| <div class="cube-count-lbl"></div> | |
| </div> | |
| <div class="pause-btn"><div></div></div> |
ardejorge66
/ index.html
Created
June 14, 2024 15:27
Mario made only with CSS gradients - no JS, no embedded images/data URIs, no external images and using a micro HTML =)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <main class="game"> | |
| <div class="game__background"></div> | |
| <div class="game__foreground"> | |
| <div class="foreground__mario"></div> | |
| <div class="foreground__ground"></div> | |
| </div> | |
| </main> |
ardejorge66
/ index.html
Created
June 14, 2024 15:27
Mario made only with CSS gradients - no JS, no embedded images/data URIs, no external images and using a micro HTML =)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <main class="game"> | |
| <div class="game__background"></div> | |
| <div class="game__foreground"> | |
| <div class="foreground__mario"></div> | |
| <div class="foreground__ground"></div> | |
| </div> | |
| </main> |
A Pen by Wakana Y.K. on CodePen.
OlderNewer