Create accountLogin

Recent searches

No recent searches

Search options

Only available when logged in.
flipboard.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
Welcome to Flipboard on Mastodon. A place for our community of curators and enthusiasts to inform and inspire each other. If you'd like to join please request an invitation via the sign-up page.

Administered by:

Server stats:

1.2K
active users

flipboard.social: AboutProfiles directoryPrivacy policy

Mastodon: AboutGet the appKeyboard shortcutsView source codev4.3.7

#css

112 posts95 participants0 posts today
Justin Ferrell<p>This is cool! </p><p>Because Google Fonts isn't <a href="https://mastodon.social/tags/GDPR" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>GDPR</span></a> compliant, someone built "Bunny Fonts" to be a GDPR-compliant alternative. </p><p>Drop-in replacement with an identical API!</p><p><a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDev</span></a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a></p><p><a href="https://fonts.bunny.net/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">fonts.bunny.net/</span><span class="invisible"></span></a></p>
Frontend Dogma<p>If It Works, It’s Right, by @bell.bz (@piccalil.li):</p><p><a href="https://piccalil.li/blog/if-it-works-its-right/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">piccalil.li/blog/if-it-works-i</span><span class="invisible">ts-right/</span></a></p><p><a href="https://mas.to/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a></p>
Frontend Dogma<p>Out of Order, by <span class="h-card" translate="no"><a href="https://social.design.systems/@donnie" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>donnie</span></a></span>:</p><p><a href="https://blog.damato.design/posts/out-of-order/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">blog.damato.design/posts/out-o</span><span class="invisible">f-order/</span></a></p><p><a href="https://mas.to/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a> <a href="https://mas.to/tags/positioning" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>positioning</span></a> <a href="https://mas.to/tags/design" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>design</span></a></p>
Nina Haghighi<p>Back when I was learning about <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a>, there was an amazing resource called CSS Zen Garden. It helped expand my knowledge of what was possible. It was like magic. TIL it's still around (no Internet Archive needed). <a href="https://csszengarden.com" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">csszengarden.com</span><span class="invisible"></span></a></p>
devmaster<p>Hello, everyone</p><p>I'm a Senior Full Stack Developer with 8+ years of experience delivering scalable, high-performance web applications across startups and global companies. I specialize in JavaScript, TypeScript, Python, React, Next.js, Angular, Vue, Node.js, Django, and FastAPI.</p><p>Please check my past work here:<br><a href="https://alilee.vercel.app" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">alilee.vercel.app</span><span class="invisible"></span></a></p><p>Let’s build something amazing together.</p><p><a href="https://mastodon.social/tags/forhire" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>forhire</span></a> <a href="https://mastodon.social/tags/remote" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>remote</span></a> <a href="https://mastodon.social/tags/wfh" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>wfh</span></a> <a href="https://mastodon.social/tags/fullstack" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>fullstack</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/seeking" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>seeking</span></a> <a href="https://mastodon.social/tags/job" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>job</span></a> <a href="https://mastodon.social/tags/gigs" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>gigs</span></a> <a href="https://mastodon.social/tags/contract" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>contract</span></a> <a href="https://mastodon.social/tags/opportunity" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>opportunity</span></a> <a href="https://mastodon.social/tags/work" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>work</span></a> <a href="https://mastodon.social/tags/backend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>backend</span></a> <a href="https://mastodon.social/tags/react" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>react</span></a> <a href="https://mastodon.social/tags/next" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>next</span></a>.js <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a></p>
CSS Basics<p>CSS Holographic Masks: "Experimenting with some <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> holographic effects, inspired by this guide from Robb Owen: Holograms, light-leaks and how to build CSS-only shaders." <a href="https://codepen.io/HejChristian/details/YPzLbYX" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/HejChristian/detail</span><span class="invisible">s/YPzLbYX</span></a></p>
CSS Basics<p>A fluid <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> methodology: "Fluid CSS methodologies have completely transformed my approach to web integration by improving the responsive aspect and simplifying maintenance. I find this topic deceptively simple yet incredibly powerful and still relevant today." <a href="https://willybrauner.com/journal/a-fluid-css-methodology" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">willybrauner.com/journal/a-flu</span><span class="invisible">id-css-methodology</span></a></p>
Friday Front-End<p>Cover Flow with Modern <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a>: Scroll-Driven Animations in Action: "Cover Flow let users flip through items as if browsing a tangible collection. Today, we can recreate this effect using only HTML and CSS, thanks to advancements like scroll-driven animations." <a href="https://addyosmani.com/blog/coverflow/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">addyosmani.com/blog/coverflow/</span><span class="invisible"></span></a></p>
claas<p>Quick post on how to use the hot new <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> scroll state container queries in <a href="https://mastodon.social/tags/TailwindCSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>TailwindCSS</span></a> <br><a href="https://claas.dev/posts/scroll-state-container-queries-in-tailwind-css/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">claas.dev/posts/scroll-state-c</span><span class="invisible">ontainer-queries-in-tailwind-css/</span></a></p>
Tyler Sticka<p>I’m fortunate to have worked with a lot of amazing designers over the years. Some were curious about designing in the browser with basic <a href="https://social.lol/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>HTML</span></a> and <a href="https://social.lol/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a>, but weren’t sure where to begin, or felt discouraged by a lot of developer-centric content.</p><p>This is the advice I gave that seemed to resonate most: <a href="https://cloudfour.com/thinks/designing-in-the-browser-five-tips-for-beginners/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">cloudfour.com/thinks/designing</span><span class="invisible">-in-the-browser-five-tips-for-beginners/</span></a></p><p><a href="https://social.lol/tags/WebDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDesign</span></a> <a href="https://social.lol/tags/DesignProcess" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>DesignProcess</span></a></p>
Dave<p>How does the z-order stack behave with Shadow DOM? Is it all above or below the normal DOM components or are they intermixed somehow? For instance, if you launch a full screen modal from the shadow dom, does it behave “properly” in terms of z-index? <a href="https://podcastindex.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a></p>
Chris Jarvis :battery_full:<p>CSS Eggs the new Batch. I made more CSS Egg art. This time I tired to make them more realistic by using shading.</p><p><a href="https://dev.to/jarvisscript/css-eggs-the-new-batch-1p90" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">dev.to/jarvisscript/css-eggs-t</span><span class="invisible">he-new-batch-1p90</span></a></p><p><a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://hachyderm.io/tags/Blog" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Blog</span></a> <a href="https://hachyderm.io/tags/CSSArt" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSSArt</span></a></p>
devmaster<p>Hello, everyone</p><p>I'm a Senior Full Stack Developer with 8+ years of experience delivering scalable, high-performance web applications across startups and global companies. I specialize in JavaScript, TypeScript, Python, React, Next.js, Angular, Vue, Node.js, Django, and FastAPI.</p><p>Please check my past work here:<br><a href="https://alilee.vercel.app" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">alilee.vercel.app</span><span class="invisible"></span></a></p><p>Let’s build something amazing together.</p><p><a href="https://mastodon.social/tags/forhire" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>forhire</span></a> <a href="https://mastodon.social/tags/remote" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>remote</span></a> <a href="https://mastodon.social/tags/wfh" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>wfh</span></a> <a href="https://mastodon.social/tags/fullstack" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>fullstack</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/seeking" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>seeking</span></a> <a href="https://mastodon.social/tags/job" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>job</span></a> <a href="https://mastodon.social/tags/gigs" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>gigs</span></a> <a href="https://mastodon.social/tags/contract" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>contract</span></a> <a href="https://mastodon.social/tags/opportunity" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>opportunity</span></a> <a href="https://mastodon.social/tags/work" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>work</span></a> <a href="https://mastodon.social/tags/backend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>backend</span></a> <a href="https://mastodon.social/tags/react" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>react</span></a> <a href="https://mastodon.social/tags/next" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>next</span></a>.js <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a></p>
Frontend Dogma<p>Use “shape()” for Responsive Clipping, by <span class="h-card" translate="no"><a href="https://indieweb.social/@nomster" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>nomster</span></a></span> (<span class="h-card" translate="no"><a href="https://chromium.social/@developers" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>developers</span></a></span>):</p><p><a href="https://developer.chrome.com/blog/css-shape" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">developer.chrome.com/blog/css-</span><span class="invisible">shape</span></a></p><p><a href="https://mas.to/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a> <a href="https://mas.to/tags/functions" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>functions</span></a> <a href="https://mas.to/tags/shapes" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>shapes</span></a> <a href="https://mas.to/tags/clipping" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>clipping</span></a> <a href="https://mas.to/tags/responsivedesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>responsivedesign</span></a></p>
Eric A. Meyer<p>Have you ever wanted to have gap-rules in your <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> Grid layouts, similar to column-rules? The Gap Decorations specification has its first public working draft! <a href="https://www.w3.org/TR/2025/WD-css-gaps-1-20250417/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">w3.org/TR/2025/WD-css-gaps-1-2</span><span class="invisible">0250417/</span></a></p><p>(“First public working draft” means it’s still being worked on and things in it might change, but the work has been made public and is now part of the historical record. This is a good time for the community [including YOU!] to read it and give feedback. Do **NOT** expect implementations right away.)</p>
Inautilo<p><a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Development</span></a> <a href="https://mastodon.social/tags/Introductions" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Introductions</span></a><br>The customizable select (part two) · Potions, anchoring, and radial shenanigans in CSS <a href="https://ilo.im/163bxd" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">ilo.im/163bxd</span><span class="invisible"></span></a></p><p>_____<br><a href="https://mastodon.social/tags/SelectElement" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SelectElement</span></a> <a href="https://mastodon.social/tags/Form" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Form</span></a> <a href="https://mastodon.social/tags/AnchorPositioning" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AnchorPositioning</span></a> <a href="https://mastodon.social/tags/ProgressiveEnhancement" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ProgressiveEnhancement</span></a> <a href="https://mastodon.social/tags/Chrome" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Chrome</span></a> <a href="https://mastodon.social/tags/Browser" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Browser</span></a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDev</span></a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Frontend</span></a> <a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>HTML</span></a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a></p>
devmaster<p>Hello, everyone</p><p>I'm a Senior Full Stack Developer with 8+ years of experience delivering scalable, high-performance web applications across startups and global companies. I specialize in JavaScript, TypeScript, Python, React, Next.js, Angular, Vue, Node.js, Django, and FastAPI.</p><p>Please check my past work here:<br><a href="https://alilee.vercel.app" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">alilee.vercel.app</span><span class="invisible"></span></a></p><p>Let’s build something amazing together.</p><p><a href="https://mastodon.social/tags/forhire" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>forhire</span></a> <a href="https://mastodon.social/tags/remote" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>remote</span></a> <a href="https://mastodon.social/tags/wfh" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>wfh</span></a> <a href="https://mastodon.social/tags/fullstack" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>fullstack</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/seeking" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>seeking</span></a> <a href="https://mastodon.social/tags/job" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>job</span></a> <a href="https://mastodon.social/tags/gigs" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>gigs</span></a> <a href="https://mastodon.social/tags/contract" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>contract</span></a> <a href="https://mastodon.social/tags/opportunity" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>opportunity</span></a> <a href="https://mastodon.social/tags/work" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>work</span></a> <a href="https://mastodon.social/tags/backend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>backend</span></a> <a href="https://mastodon.social/tags/react" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>react</span></a> <a href="https://mastodon.social/tags/next" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>next</span></a>.js <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a></p>
xoron :verified:<p>JSX-Syntax with Webcomponents.</p><p><a href="https://positive-intentions.com/blog/dim-functional-webcomponents" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">positive-intentions.com/blog/d</span><span class="invisible">im-functional-webcomponents</span></a></p><p>I made something to try out and I'm working towards a UI framework for my personal projects. It's far from finished but perhaps this might be interesting to share.</p><p><a href="https://infosec.exchange/tags/functional" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>functional</span></a> <a href="https://infosec.exchange/tags/webcomponents" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webcomponents</span></a> <a href="https://infosec.exchange/tags/javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>javascript</span></a> <a href="https://infosec.exchange/tags/html" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>html</span></a> <a href="https://infosec.exchange/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a> <a href="https://infosec.exchange/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>web</span></a> <a href="https://infosec.exchange/tags/components" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>components</span></a> <a href="https://infosec.exchange/tags/library" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>library</span></a> <a href="https://infosec.exchange/tags/webcomponents" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webcomponents</span></a> <a href="https://infosec.exchange/tags/customelements" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>customelements</span></a> <a href="https://infosec.exchange/tags/lithtml" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>lithtml</span></a> <a href="https://infosec.exchange/tags/lit" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>lit</span></a> <a href="https://infosec.exchange/tags/polymer" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>polymer</span></a> <a href="https://infosec.exchange/tags/OpenSource" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>OpenSource</span></a></p>
CSS by T. Afif :verified:<p>And here is the code to generate any polygon shape with rounded corners!</p><p><a href="https://css-tip.com/rounded-polygon/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">css-tip.com/rounded-polygon/</span><span class="invisible"></span></a></p><p>Update the variables then get your code (There is another variation using CSS variables as well).</p><p><a href="https://front-end.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://front-end.social/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>HTML</span></a></p>
Christian Alder<p>This weeks CodePen challenge got me learning about glowing fungi, jellyfish, and fireflies. </p><p>Amazingly CSS can animate along a SVG path and I am so happy to have learnt about that. 🥳 I thought for sure I would need JS for the fireflies. </p><p>CodePen: <a href="https://codepen.io/HejChristian/full/VYYwqza" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/HejChristian/full/V</span><span class="invisible">YYwqza</span></a></p><p><a href="https://mastodon.social/tags/CodePen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CodePen</span></a> <a href="https://mastodon.social/tags/CodePenChallenge" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CodePenChallenge</span></a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a></p>
ExploreLive feeds
About