Skip to content

Instantly share code, notes, and snippets.

@Ashon-G
Ashon-G / css-god-rays.markdown
Created December 24, 2023 20:11
CSS God Rays
@Ashon-G
Ashon-G / css-god-rays.markdown
Created December 24, 2023 20:11
CSS God Rays
@Ashon-G
Ashon-G / css-god-rays.markdown
Created December 24, 2023 20:11
CSS God Rays
@Ashon-G
Ashon-G / css-god-rays.markdown
Created December 24, 2023 20:11
CSS God Rays
@Ashon-G
Ashon-G / index.html
Created December 16, 2023 08:26
Snippet from comcard.us
<!-- Exported with SnipCSS extension (Ver 1.8.3) -->
<div class="css-xoq">
<div class="css-2xx">
<svg viewBox="0 0 434 434" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle opacity="0.45" cx="217" cy="217" r="152.5" stroke="#00A095" stroke-linejoin="round" stroke-dasharray="8 8">
</circle>
<circle opacity="0.45" cx="217" cy="217" r="216.5" stroke="#00A095" stroke-linejoin="round" stroke-dasharray="8 8">
</circle>
</svg>
</div>
@Ashon-G
Ashon-G / index.html
Created December 14, 2023 20:41
Trending Photography Banner Concept
<body>
<main>
<section class="info-section">
<div class="left-part">
<h1><span class="d-flex">we make</span> <span class="text"></span></h1>
<p>We create classes every next month with our new talented creators</p>
<a href="https://www.yudiz.com/" class="book-link">
<span class="linktext">Book Your Seat Now</span>
<span class="arrow">
@Ashon-G
Ashon-G / index.html
Created December 14, 2023 20:38
Trending Photography Banner Concept
<body>
<main>
<section class="info-section">
<div class="left-part">
<h1><span class="d-flex">we make</span> <span class="text"></span></h1>
<p>We create classes every next month with our new talented creators</p>
<a href="https://www.yudiz.com/" class="book-link">
<span class="linktext">Book Your Seat Now</span>
<span class="arrow">
@Ashon-G
Ashon-G / index.html
Created December 14, 2023 20:37
Proximity Glow Cards
<div class="container">
<article>
<div class="glows"></div>
<span class="header">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
<path fill-rule="evenodd" d="M17.303 5.197A7.5 7.5 0 006.697 15.803a.75.75 0 01-1.061 1.061A9 9 0 1121 10.5a.75.75 0 01-1.5 0c0-1.92-.732-3.839-2.197-5.303zm-2.121 2.121a4.5 4.5 0 00-6.364 6.364.75.75 0 11-1.06 1.06A6 6 0 1118 10.5a.75.75 0 01-1.5 0c0-1.153-.44-2.303-1.318-3.182zm-3.634 1.314a.75.75 0 01.82.311l5.228 7.917a.75.75 0 01-.777 1.148l-2.097-.43 1.045 3.9a.75.75 0 01-1.45.388l-1.044-3.899-1.601 1.42a.75.75 0 01-1.247-.606l.569-9.47a.75.75 0 01.554-.68z" clip-rule="evenodd" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
<path fill-rule="evenodd" d="M17.303 5.197A7.5 7.5 0 006.697 15.803a.75.75 0 01-1.061 1.061A9 9 0 1121 10.5a.75.75 0 01-1.5 0c0-1.92-.732-3.839-2.197-5.303zm-2.121 2.121a4.5
@Ashon-G
Ashon-G / credit-card-marketplace.markdown
Created December 13, 2023 12:59
Credit Card Marketplace
@Ashon-G
Ashon-G / index.html
Created November 6, 2023 14:07
Text scroll and hover effect with GSAP and clip
<section class="dark-time">
<div class="container">
<h1 class="text">TAKES ME<span>WOAH</span></h1>
<h1 class="text">BACK<span>WAY BACK</span></h1>
<h1 class="text">TO A VERY<span>CRAZYYY</span></h1>
<h1 class="text">DARK TIME<span><a href="https://stacksorted.com/text-effects/minh-pham" target="_blank">DARK AGES</a></span></h1>
<h1 class="text">IN MY LIFE<span><a href="https://twitter.com/juxtopposed" target="_blank">READ ON</a></span></h1>
</div>
</section>