Ben EvansMar 19

To celebrate something-or-other, I created a retro CRT using only vanilla CSS!

๐Ÿ“บ https://codepen.io/ivorjetski/pen/qEaRjBw

No images. No JavaScript. No SASS.

Fully turn-off-and-on-able!

Also a documentary about the making of it: https://www.youtube.com/watch?v=wdNHwIqMFDk

@CodePen #css #cssart #cssonly

CodePen TV ๐Ÿ“บ 100% Pure CSS

๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ๐Ÿ“บ ๐Ÿšซ - 100% No Images โ˜• - Definitely no JavaScript ๐Ÿค– - Absolutely no AI ๐Ÿ˜‡ - Only the purest HTML and completely vanilla fresh CSS!! ๐Ÿ“บ...

N-gated Hacker NewsNov 4
๐ŸŒ A CSS-only terrain generator? ๐Ÿ˜‚ Because who needs functional 3D modeling software when you can painstakingly craft your own mediocre mountains in CSS! Get ready to spend your weekend rotating, tilting, and zooming your way to pixelated paradise. ๐Ÿ™ƒ
https://terra.layoutit.com #CSSonly #TerrainGenerator #WeekendProject #PixelArt #FunWithCSS #HackerNews #ngated
Layoutit Terra - CSS Terrain Generator

An interactive CSS terrain generator. Define a grid and generate your terrain!

Hacker NewsNov 4

A CSS-Only Terrain Generator

https://terra.layoutit.com

#HackerNews #CSSOnly #TerrainGenerator #WebDevelopment #DesignTools

Layoutit Terra - CSS Terrain Generator

An interactive CSS terrain generator. Define a grid and generate your terrain!

Hacker NewsOct 2

Visual loading states for Turbo Frames with CSS only

https://railsdesigner.com/visual-loading-turbo-frames/

#HackerNews #VisualLoadingStates #TurboFrames #CSSOnly #WebDevelopment #RailsDesigner

Visual loading states for Turbo Framesโ€ฉwith CSS only

Learn how to add instant loading feedback to your Turbo Frames without JavaScript. Iโ€™ll walk you through using the aria-busy state with CSS pseudo-elements to show text or animated SVG spinners during slow requests.

Rails Designer
Show threadPixelcode Apps โ€‹Jul 7, 2025

@fnohe It's actually fairly easy to create a #CssOnly dark mode: Two radio buttons let the user toggle between light/dark. In my stylesheet, I've added an `html:has(#dark-mode:checked)` rule which applies the dark theme. With more #CSS, only one button is visible at a time and both buttons look like regular ones (not like typical radio buttons). #WebDev

You can see it in action on https://blog.forgoodeyesonly.eu and https://forgoodeyesonly.eu.

I've published a #CodePen demo too: https://codepen.io/realpixelcode/pen/KwpOjeW

All blog posts | For Good Eyes Only Blog

The purpose of this Free Ethical licence is promoting a sustainable and dignified world by attaching conditions of justice and morality to the use and re-distribution of licensed works.

For Good Eyes Only Blog
Pixelcode Apps โ€‹Jul 1, 2025

So I made a thing: #russiaโ€‹n-speaking visitors are now greeted with an anti-war popup on https://forgoodeyesonly.eu and https://blog.forgoodeyesonly.eu! ๐Ÿ‡บ๐Ÿ‡ฆ

Feel free to copy it to your own website! You can try it out without changing your browser's language on Codepen: https://codepen.io/realpixelcode/pen/RNPOmdw

And, yes, you can adjust it to be shown without JavaScript (but to all visitors then), because the popup is actually just an #HTML details element. ๐Ÿ˜Ž

#StandWithUkraine #Ukraine #WebDev #EthicalWebDev #CSS #CssOnly

Jon LunmanMay 2, 2025

Hey #CSS folks, I have a #CssOnly challenge for you.

https://codepen.io/jlunman/pen/RNwrRBo

Challenge: CSS-only Multi-Selection Detection

...

alephoto85    Apr 20, 2025
Every once in a while I like a change but this time I'm playing at home ๐Ÿคช๐Ÿคช๐Ÿคช

#blog #guufITA #webdev #cssonly #fuckjs #working #zola #ssg

Hacker NewsApr 3, 2025

Minimal CSS-only blurry image placeholders

https://leanrada.com/notes/css-only-lqip/

#HackerNews #MinimalCSS #BlurryImage #Placeholders #CSSOnly #WebDesign

Minimal CSS-only blurry image placeholders

Show threadBojidar MarinovMar 28, 2025

Also, new article's up! Exploring how I made a CSS-only slideshow with scroll snapping (plus some quick notes on radio-button approaches) ๐Ÿ˜Š
You can even navigate the slideshow with arrow keys!

Overall, I'm really happy to see CSS features to control scroll behavior without JS now! Scroll snap is a joy to use, and opens the door to a lot of easy-to-do customization that required a lot of carefully managed scroll-linked event listeners before โœจ

https://bojidar-bg.dev/blog/2025-03-28-css-slideshow/

#CSS #CssOnly #webdev