Konstantin Denerz
@konstantindenerz.bsky.social
Consultant & Dev & Designer @ Thinktecture; export const { CSS, 🤖 GenAI, 🅰️ngular, Material, nvim, UX⚡️UI, Figma, CodePens,🖖... } = ❤️; 🌐 UTC+1 (Saar) https://konstantin-denerz.com https://codepen.io/konstantindenerz
CSS is DOOMed! I've build DOOM in CSS and every wall, floor, barrel, and imp is a div, positioned in 3D space using CSS transforms. cssdoom.wtf Try it out! But... not every browser can handle it. This is taking the browser to its limit. Chrome has some issues. Safari too. Bugs will be filed.
cssDOOM
DOOM rendered entirely in CSS. Every wall, floor, barrel, and imp is a div, positioned in 3D space using CSS transforms.
cssdoom.wtf
Running 5+ Claude Code instances in tmux and tired of checking which one needs attention? 😩 Built a tiny Claude Code plugin: a pixel-art overlay pops up in tmux ✨, shows which window needs me, Enter to jump there. 📺 konstantin-denerz.com/cc-notifynub... #ClaudeCode #tmux #CLI #neovim #genai
The Commodore logo built with pure CSS. Single element, using the CSS shape() function and conic-gradient, no SVG, no assets ✨ 📺 Demo on @codepen.io : codepen.io/editor/konst... #C64 #CSS #RetroComputing #C64U #Commodore #webdev
C64 (CSS Shape() )
Commodore logo built with CSS shapes function and conic gradient.
codepen.io
The Commodore logo built with pure CSS. Single element, using the CSS shape() function and conic-gradient, no SVG, no assets ✨ 📺 Demo on @codepen.io : codepen.io/editor/konst... #C64 #CSS #RetroComputing #C64U #Commodore #webdev
C64 (CSS Shape() )
Commodore logo built with CSS shapes function and conic gradient.
codepen.io
📙 📗 📘 📕 The History of Themeable User Interfaces: bradfrost.com/blog/post/th... It was an incredible experience to write this piece. It blurs together the history of computers, video games, the web, design systems, and my own existence on this planet.
The History of Themeable User Interfaces
A full-ish history of user interfaces that can be themed to meet the opportunities and constraints of the time
bradfrost.com
🥳 CSS functions have arrived*!!! 🥳 And they are *AWESOME* Now, you can do: @function --alpha(--color, --opacity) { result: rgb(from var(--color) r g b / var(--opacity)); } div { background: --alpha(red, 80%); } Lean more: una.im/5-css-functi... (*arrived = in the latest stable Chrome)
una.im | 5 Useful CSS functions using the new @function rule
CSS custom functions are a gamechanger. Here are 5 really useful examples.
una.im
CSS Weekly #612 🎠 Are CSS Carousels are accessible? ✂️ How margin-trim works 🦉 Should you use an owl selector (* + *) 👾 Retro animations & modern CSS Featuring @sarasoueidan.com, @jensimmons.bsky.social, @anatudor.bsky.social, @jamessw.com, @konstantindenerz.bsky.social. 🙏 cssw.io/issue-612
CSS Weekly Issue #612
Find out if CSS Carousels are accessible, how to trim margins using margin-trim property, if you should use an owl selector, and more.
cssw.io
10 Cool CodePen Demos from April 2025 alvaromontoro.com/10-cool-code... Lots of HTML+CSS demos in this edition: 3D product showcases, inspirational CSS Art, scroll-driven animations, engaging HTML and CSS-only components: toggles, accordions, buttons... and more! #css #html #javascript #webdev
10 Cool CodePen demos
10 Cool CodePen demos from April 2025
alvaromontoro.com
Auto layout just got more powerful with Grid → Format in a gallery, card or bento layout → Items can span multiple cells #Config2025
In the next video I break down a 3D sphere intersection demo from Codepen and it's going to be absolute cinema.
And a new version... I like it, but maybe I should get rid of the lightsaber to make it less evil (CSS is inherently evil anyway, but deep down is good).
Deep Dive into LLMs like ChatGPT by Andrej Karpathy 🔥 www.youtube.com/watch?v=7xTG... #llm #genai #ai
Deep Dive into LLMs like ChatGPT
YouTube video by Andrej Karpathy
youtube.com
A CSS demo where I use only one additional element besides the body, and lots of dynamically generated gradients using SCSS. ✨🖖 @codepen.io codepen.io/konstantinde... #CSS #webdev #demo #demoscene #art #gm #space #pixelart
Make websites? Are you reading webkit.org? We published 6 articles in the last 5 weeks — aiming for at least one a week from now on. Teaching new tech, proposals for the future, and what’s coming in Safari. • lh units • shape() • text-wrap: pretty • Safari 18.4 • Item Flow • Declarative Web Push
WebKit
Open Source Web Browser Engine
webkit.org
Following UA+, here's the next project. CSS boilerplate: A default CSS structure for projects of any size. It comes with a detailed explanation how I use cascade layers. fokus.dev/tools/css-bo...
CSS boilerplate | fokus
UA+ (User agent plus), a different type of reset style sheet
fokus.dev
A CSS demo where I use only one additional element besides the body, and lots of dynamically generated gradients using SCSS. ✨🖖 @codepen.io codepen.io/konstantinde... #CSS #webdev #demo #demoscene #art #gm #space #pixelart
🌰 Writing/Building a 3D geometry engine from scratch, starting at 18:00 CEST on the seminars stream. A great chance to improve your demo-making! 2025.revision-party.net/live/
LIVE
Revision 2025 LIVE
2025.revision-party.net
🔥🔥🔥
Revision Demoparty@revision-party.bsky.social · last yr.Revision 2025 started! Doors are open! We’re happy to have you all with us again, either on-site or remote. Welcome to Revision 2025! Last minute additions to our timetable. Wie have two more seminars 2025.revision-party.net/seminars/ 2025.revision-party.net/events/speci...
✨
Jen Simmons@jensimmons.bsky.social · last yr.Have you ever wished you could make a real-deal complex shape in CSS? The web’s had circle(), ellipse() and polygon() for years. But in order to do anything more SVG-style syntax was required. Well, no more. Now, you can make complex shapes in CSS! webkit.org/blog/16794/t...
✍️ New Article: First Look at The Modern attr() I explored the new attr() capabilities and shared my thoughts about it. Happy reading! ishadeed.com/article/mode...
#CSS view transitions I appreciate not caring about a lot of details in this interaction pattern, like if landscape or portrait, grid and the browser continue to take care of everything cdpn.io/pen/full/dyL...