Livello Segreto

Fractal KittyIf anyone wants to make a Half-square Hilbert I made a toy to play with patterns. (fixed a bug from the first go)I need fabric - so I plan to start maybe later this week. <a href="https://codepen.io/fractalkitty/live/pvoBwxv/edc44d4417167d59d8b2c1d9ad574109" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/fractalkitty/live/pvoBwxv/edc44d4417167d59d8b2c1d9ad574109</a><a href="https://mathstodon.xyz/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mathstodon.xyz/tags/p5js" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#p5js</a> <a href="https://mathstodon.xyz/tags/quilting" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#quilting</a> <a href="https://mathstodon.xyz/tags/hilbertCurve" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#hilbertCurve</a> <a href="https://mathstodon.xyz/tags/fiberArt" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fiberArt</a> <a href="https://mathstodon.xyz/tags/quilts" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#quilts</a> <a href="https://mathstodon.xyz/tags/mathart" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#mathart</a>

Konstantin DenerzCSS & SVG ✨ <a href="https://codepen.io/konstantindenerz/full/bNGQpqJ" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/konstantindenerz/full/bNGQpqJ</a><a href="https://mastodon.world/tags/creativecoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#creativecoding</a> <a href="https://mastodon.world/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> <a href="https://mastodon.world/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.world/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#svg</a> <a href="https://mastodon.world/tags/demoscene" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#demoscene</a> <a href="https://mastodon.world/tags/art" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#art</a> <a href="https://mastodon.world/tags/cssart" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#cssart</a> <a href="https://mastodon.world/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mastodon.world/tags/gm" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#gm</a> <a href="https://mastodon.world/tags/animation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#animation</a>

Ana Tudor 🐯Here's a simple image stack with an `--ang` rotation around an `--xy` point (both pseudo-random, generated & set inline via Pug) + a 3D entry animation (click Run to run it again).Live on <a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@codepen</a> <a href="https://codepen.io/thebabydino/pen/qEBJpRb?editors=0100" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/thebabydino/pen/qEBJpRb?editors=0100</a><a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.social/tags/3D" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#3D</a> <a href="https://mastodon.social/tags/filter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#filter</a> <a href="https://mastodon.social/tags/cssFilter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#cssFilter</a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#animation</a> <a href="https://mastodon.social/tags/cssAnimation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#cssAnimation</a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#code</a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#coding</a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#frontend</a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webDev</a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webDevelopment</a> <a href="https://mastodon.social/tags/CodePen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CodePen</a>

Fractal Kittytoday's creative coding sketch: <a href="https://codepen.io/fractalkitty/pen/ogNPgRq?editors=0010" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/fractalkitty/pen/ogNPgRq?editors=0010</a><a href="https://mathstodon.xyz/tags/processingOrg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#processingOrg</a> <a href="https://mathstodon.xyz/tags/p5js" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#p5js</a> <a href="https://mathstodon.xyz/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mathstodon.xyz/tags/creativecoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#creativecoding</a>

Fractal KittyStarting 3d print of enneper surface created with Houdini - hope it works :) It seems like it sliced ok. I made a couple of them dance in codepen as well <a href="https://codepen.io/fractalkitty/live/EaxQwWx" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/fractalkitty/live/EaxQwWx</a>If you want to try - here is the obj model (no guarantee it will work): <a href="https://assets.codepen.io/4559259/enneper.obj" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://assets.codepen.io/4559259/enneper.obj</a><a href="https://mathstodon.xyz/tags/houdini" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#houdini</a> <a href="https://mathstodon.xyz/tags/math" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#math</a> <a href="https://mathstodon.xyz/tags/3dPrinting" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#3dPrinting</a> <a href="https://mathstodon.xyz/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mathstodon.xyz/tags/surface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#surface</a> <a href="https://mathstodon.xyz/tags/objFile" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#objFile</a> <a href="https://mathstodon.xyz/tags/recurseCenter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#recurseCenter</a>

Fractal Kittypi sketch:<a href="https://codepen.io/fractalkitty/live/YPzYqNr" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/fractalkitty/live/YPzYqNr</a><a href="https://mathstodon.xyz/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a>

Alvaro MontoroA video showing how to create an animated toggle switch with a single HTML element and some CSS: <a href="https://youtu.be/w47sRmAM_RY" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://youtu.be/w47sRmAM_RY</a>And the source code (with some variations) on <a href="https://front-end.social/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a>: <a href="https://codepen.io/alvaromontoro/pen/MYWmppe" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/alvaromontoro/pen/MYWmppe</a><a href="https://front-end.social/tags/html" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#html</a> <a href="https://front-end.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> <a href="https://front-end.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webdevelopment</a>

Cavyherd<a href="https://phpc.social/@Crell" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@Crell</a> So on the chance you would tolerate a newbie question:I just pulled up Codepen, & was able to dump the php code out of my html file into an html pen, & it comes up in the display window as it should. But it fails when I click "submit" bc apparently there's no way to create the php file?<a href="https://wandering.shop/tags/php" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#php</a> <a href="https://wandering.shop/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a>

Ana Tudor 🐯2️⃣ solid fill - first three values on the last column are set to the desired RGB values (decimal representation of percentage RGB)Interactive demo on <a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@codepen</a> <a href="https://codepen.io/thebabydino/full/LYamwrz" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/thebabydino/full/LYamwrz</a><a href="https://mastodon.social/@anatudor/112157559510002242" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://mastodon.social/@anatudor/112157559510002242</a><a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SVG</a> <a href="https://mastodon.social/tags/filter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#filter</a> <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> <a href="https://mastodon.social/tags/CodePen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CodePen</a> <a href="https://mastodon.social/tags/interactive" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#interactive</a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#code</a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#coding</a> <a href="https://mastodon.social/tags/svgFilter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#svgFilter</a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#frontend</a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webDev</a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webDevelopment</a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a>

Fractal KittyI roughed out a game of life penguin toy for a few hours today after not sleeping with the storms last night. It felt good to just write, rewrite and then rewrite what I was wanting to make as I went - I should have recorded (maybe streamed?) how it evolved.Live: <a href="https://codepen.io/fractalkitty/live/JojRByL" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/fractalkitty/live/JojRByL</a>Code: <a href="https://codepen.io/fractalkitty/pen/JojRByL?editors=0110" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/fractalkitty/pen/JojRByL?editors=0110</a>You get to draw between each frame with your penguin in the GOL, but can't let more that 60% of the grid die or get caught on an unstable iceberg. The countdown speeds up a bit as you keep going. <a href="https://mathstodon.xyz/tags/gameOfLife" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#gameOfLife</a> <a href="https://mathstodon.xyz/tags/automata" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#automata</a> <a href="https://mathstodon.xyz/tags/GoL" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#GoL</a> <a href="https://mathstodon.xyz/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mathstodon.xyz/tags/RecurseCenter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#RecurseCenter</a> <a href="https://mathstodon.xyz/tags/p5js" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#p5js</a> <a href="https://mathstodon.xyz/tags/processingOrg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#processingOrg</a>

Inautilo<a href="https://mastodon.social/tags/Design" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Design</a> <a href="https://mastodon.social/tags/Launches" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Launches</a> Monospace ASCII art generator · Upload an image and convert it to ASCII art <a href="https://ilo.im/1626g2" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://ilo.im/1626g2</a>_____ <a href="https://mastodon.social/tags/ASCII" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#ASCII</a> <a href="https://mastodon.social/tags/Images" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Images</a> <a href="https://mastodon.social/tags/Generator" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Generator</a> <a href="https://mastodon.social/tags/CodePen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CodePen</a> <a href="https://mastodon.social/tags/Design" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Design</a> <a href="https://mastodon.social/tags/WebDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDesign</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/Backend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Backend</a>

pablolarah🍒 The Most Hearted Pens of 2024 at <a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@codepen</a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#code</a> <a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webdev</a> <a href="https://mastodon.social/tags/Codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Codepen</a> <a href="https://codepen.io/2024/popular" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/2024/popular</a>

Julien BidoretSome months ago I asked <a href="https://post.lurk.org/@raphael" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@raphael</a> if Stolon could be improved and adjusted for my own use, so that I can move out of <a href="https://post.lurk.org/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> and host my sketches on my server. He kindly replied GO! and we went though a wild and fun push / pull game to upgrade the editor, enhance the behavior, allow <a href="https://post.lurk.org/tags/pagedjs" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#pagedjs</a> and <a href="https://post.lurk.org/tags/p5js" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#p5js</a> templates. Check it out on <a href="https://gitlab.com/raphaelbastide/stolon" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://gitlab.com/raphaelbastide/stolon</a><a href="https://post.lurk.org/tags/tinyLibreTools" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#tinyLibreTools</a>

Konstantin DenerzWow, how awesome is this? My <a href="https://mastodon.world/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> demo ranked 9th in the Top 100 "The Most Hearted 2024" list ❤️‍🔥. Huge thanks for all the feedback and support! ✨ <a href="https://mastodon.world/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mastodon.world/tags/community" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#community</a>

Fractal KittyCheckout Codepen Spark! I have an isometric piece in there:<a href="https://codepen.io/spark/422" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/spark/422</a><a href="https://mathstodon.xyz/tags/genuary5" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#genuary5</a> <a href="https://mathstodon.xyz/tags/genuary" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#genuary</a> <a href="https://mathstodon.xyz/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mathstodon.xyz/tags/creativeCoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#creativeCoding</a>

Ana Tudor 🐯Somebody asked how to fix a text fill effect and got an answer, but I thought I could improve on that, so here's me writing in detail about what I'd do instead <a href="https://www.reddit.com/r/css/comments/1hwhxyn/comment/m6d9wxv/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://www.reddit.com/r/css/comments/1hwhxyn/comment/m6d9wxv/</a>And my solution on <a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@codepen</a> <a href="https://codepen.io/thebabydino/pen/RNbQXNx?editors=1100" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/thebabydino/pen/RNbQXNx?editors=1100</a><a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.social/tags/textEffect" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#textEffect</a> <a href="https://mastodon.social/tags/text" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#text</a> <a href="https://mastodon.social/tags/textEffects" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#textEffects</a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#code</a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webDev</a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webDevelopment</a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#coding</a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#frontend</a> <a href="https://mastodon.social/tags/cssGradient" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#cssGradient</a> <a href="https://mastodon.social/tags/CodePen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CodePen</a>

Dennis FrankCSS grid challenge (aka my current <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> issue): pushing the last item (footer) to the bottom. My problem is that there can be an unknown number of elements between the header and footer. CSS grid is also set because I also need grid columns in my specific use case. The screenshot shows what it should look like. Here is a commented <a href="https://mastodon.social/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a>: <a href="https://codepen.io/df/pen/bNbgzdb/ca4e9163ad1025399b0f93672c84bc3e" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/df/pen/bNbgzdb/ca4e9163ad1025399b0f93672c84bc3e</a>

Will Browar 👨🏻‍💻Here’s a link to a kitchen sink example of Admin Bar Component on CodePen so you can try it out for yourself!<a href="https://hachyderm.io/tags/webcomponents" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webcomponents</a> <a href="https://hachyderm.io/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> <a href="https://hachyderm.io/tags/cms" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#cms</a> <a href="https://hachyderm.io/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a><a href="https://codepen.io/wbrowar/pen/MYgavqL" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/wbrowar/pen/MYgavqL</a>

Konstantin Denerzrandom walk ⚡️ <a href="https://codepen.io/konstantindenerz/full/KKOYdpp" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/konstantindenerz/full/KKOYdpp</a> <a href="https://mastodon.world/tags/creativecoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#creativecoding</a> <a href="https://mastodon.world/tags/js" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#js</a> <a href="https://mastodon.world/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> <a href="https://mastodon.world/tags/art" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#art</a> <a href="https://mastodon.world/tags/randomwalk" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#randomwalk</a> @CodePen <a href="https://mastodon.world/tags/gm" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#gm</a>

Martin GrubingerAt <a href="https://mastodon.social/tags/btconf" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#btconf</a> I was discussing with my colleague how a manual light/dark mode switch would be feaseable in combination with <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> `light-dark()` function. Turns out, this article by <a href="https://front-end.social/@sarajw" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@sarajw</a> also explains how to go about that, along with a forked <a href="https://mastodon.social/tags/codepen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#codepen</a> by <a href="https://front-end.social/@matuzo" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@matuzo</a> – whose talk inspired this discussion in the first place. Full circle. 🤩Article: <a href="https://css-tricks.com/come-to-the-light-dark-side/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://css-tricks.com/come-to-the-light-dark-side/</a> CodePen: <a href="https://codepen.io/sarajw/pen/vYqvNPw" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codepen.io/sarajw/pen/vYqvNPw</a>

Recent searches

Search options

Administered by:

Server stats:

#codepen