#CSSonly
LightNews LightNews
ivorjetski.bsky.social
View bobbing actually works quite well! 🤩
Not sure the animation is quite right yet though. I look like I have a limp :)

#css #cssonly #cssart #frontenddev #backrooms
July 7, 2025 at 11:14 PM
cbolson.bsky.social
An Inverted radius tabs demo which uses anchor-positioning + corner-shape + :target
#cssonly

See the full demo on @codepen.io
codepen.io/cbolson/pen/...
February 4, 2026 at 8:33 AM
ivorjetski.bsky.social
To celebrate something-or-other, I created a retro CRT using only vanilla CSS!

📺 codepen.io/ivorjetski/p...

No images. No JavaScript. No SASS.

Fully turn-off-and-on-able!

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

@CodePen #css #cssart #cssonly #frontend
CodePen TV 📺 100% Pure CSS
📺📺📺📺📺📺📺📺📺📺📺📺📺📺 🚫 - 100% No Images ☕ - Definitely no JavaScript 🤖 - Absolutely no AI 😇 - Only the purest HTML and completely vanilla fresh CSS!! 📺...
codepen.io
March 19, 2026 at 2:21 PM
cbolson.bsky.social
Descrambling text using rotation and animation-timeline.
Pure CSS with no JS.

Link to demo in first comment.

#codepen #cssonly
January 9, 2026 at 6:56 PM
cbolson.bsky.social
To celebrate the launch of Artemis II 🚀, I put together a #cssonly scroll-driven animation.

Powered by animation-timeline: scroll — no JavaScript, just modern CSS.

Still WIP, but already a fun experiment.

Full demo on @codepen.io ✨
codepen.io/cbolson/full...

#artemis
April 2, 2026 at 7:32 PM
ivorjetski.bsky.social
Oh look 👀 It's The Backrooms in just CSS!

Early access creepypasta edition!

100% glitchy guaranteed!
codepen.io/ivorjetski/p...

How it was made 😱
youtu.be/xiEZ54lGFt8?...

@codepen.io #CSS #CSSArt #CSSCrimes #CSSOnly #theBackrooms #frontend #CSSGame

First person to screenshot the end wins! 🥳
The Backrooms: CSS Edition.
Early Access - Creepypasta! Based on the original 4chan thread. No Images - No JavaScript - Pure HTML - Too much CSS! Only HTML, CSS and the teeny-t...
codepen.io
June 26, 2025 at 1:34 PM
cbolson.bsky.social
A new #cssonly carousel demo built around the :scroll-* pseudo-elements.

Using:
– CSS anchor positioning for centered placement
– container style queries to toggle between transition modes

A fun experiment with some modern CSS features.

See the demo on @codepen.io

codepen.io/editor/cbols...
May 28, 2026 at 10:30 AM
ragnar-oock.bsky.social
@kevinpowell.co challenged me to adapt my rotation cube view-transition to a scroll-based animation. It kinda works with #CSSonly but I think using a bit of JS and view-transitions between sections would look better, I might try it in the future.

codepen.io/ragnar_ock/p...
June 29, 2025 at 6:42 PM
manuelsanchezdev.com
For those who come after.

codepen.io/manuelsanche...

#cssonly #pixelart #boxshadow #clairobscur #expedition33
Expedition 33 - Pixel Art
...
codepen.io
July 9, 2025 at 8:49 PM
alvaromontoro.com
@ivorjetski.bsky.social updated the CSS Backrooms demo, and it looks amazing

youtube.com/shorts/H0DZ3...
CSS Backrooms: Now with view bobbing! #css #backrooms #cssonly #frontend #freegames #webdesign
YouTube video by Ben Evans
youtube.com
July 12, 2025 at 11:19 PM
eioluseyi.com
#CssOnly container size display.
Powered, once again, by @janeori.propjockey.io's genius implementation of "CSS Type Casting to Numeric"

#CSS #Frontend #Webdev #CSSwithEIO
February 7, 2025 at 7:30 PM
ivorjetski.bsky.social
I love it when a span comes together!
codepen.io/ivorjetski/p...

@codepen.io #CSSArt #box-shadow #CSSonly #singleDiv #retro #pixelArt #80s #A-Team
The <A> Team
Pure box-shadow silliness. https://linktr.ee/ivorjetski for more...
codepen.io
April 18, 2025 at 12:54 PM
torpedero.bsky.social
#cssonly !!!
ivorjetski.bsky.social Ben Evans @ivorjetski.bsky.social · Jul 7
View bobbing actually works quite well! 🤩
Not sure the animation is quite right yet though. I look like I have a limp :)

#css #cssonly #cssart #frontenddev #backrooms
July 8, 2025 at 12:55 AM
vivarado.com
Ok, we have rewritten the CSS Only Nested Dropdown, now it is multilevel!

codepen.io/vivarado/pen...

#OpenSource #CSSOnly #UserInterface
November 22, 2025 at 3:15 PM
maikelkrause.bsky.social
Made a CSS-only switch input element, with just an ``, and no ::before/::after pseudo elements! Only uses background/border-image and an @property for the thumb position. #css #cssonly #CodePenChallenge

codepen.io/maikelkrause...
CSS-only switch input
...
codepen.io
November 12, 2024 at 4:18 PM
cbolson.bsky.social
As the 2026 World Cup enters the knockout stage, I challenged myself to build a CSS-only tournament bracket ⚽️

Using attr(), style queries and plenty of :has(), the bracket updates as you pick each winner—all without JavaScript.

Check out the demo on @codepen.io :
codepen.io/editor/cbols...
2026 World Cup Knock-Out Stages #cssonly
This bracket is 100% CSS, the logic being defined by multiple :has() selectors. Not overly practical but a fun CSS only challenge. Select the team tha
codepen.io
June 28, 2026 at 4:45 PM
cbolson.bsky.social
A new #cssonly demo: scroll-triggered counters.

In supporting browsers (Chrome only currently), counters count up when scrolled into view.

Built with `timeline-trigger`, `animation-trigger`, `attr()`, `@property` and `sibling-index()`.

See the demo on @codepen.io:
codepen.io/editor/cbols...
CSS only counters using timeline-trigger, animation-trigger & attr()
This demo uses the experimental timeline-trigger and animation-trigger properties to start CSS animations when the counters enter the viewport. The co
codepen.io
July 9, 2026 at 2:05 PM
jlunman.bsky.social
Hey #CSS folks! I've got a #CssOnly challenge for you.
codepen.io/jlunman/pen/...
Challenge: CSS-only Multi-Selection Detection
...
codepen.io
May 2, 2025 at 7:27 PM
vivarado.com
codepen.io/vivarado/pen...

We needed a drop-down with nested menus, so here is one CSS-only (two levels for now)!

• Click to open, hover to explore.
• With a hover tunnel-triangle.
• Mouse Out persistent.

VivaRado User Interfaces: codepen.io/collection/r...

#OpenSource #CSSOnly #UserInterface
CSS Only Nested Dropdown (Hover Tunnel-Triangle, MouseOut Persistent) ∞ 0.2
...
codepen.io
November 19, 2025 at 4:16 PM
jay52-tx.bsky.social
The Odometer Effect (Without JavaScript) — Preethi shows us how to approach creating a dynamic display for showing changing numeric values with just CSS and HTML || #CSSAnimation #WebDev #CSSOnly bit.ly/41fYMpA
The Odometer Effect (without JavaScript)
We can take a value set in an HTML attribute and use it in CSS, even extracting each individual digit in order to animate separately.
bit.ly
April 6, 2026 at 10:01 PM
cbolson.bsky.social
Falling cards with perspective using just CSS.
The cards drop down as you scroll down using animation-timeline.
#codepen #cssonly

(see the Codepen link in first comment)
December 11, 2025 at 8:56 PM
javidevedu.bsky.social
Level up your UI game — see more at javidev, link in my profile.
Smooth, elegant, interactive. This hover effect makes your profile shine. mystic.js
#csshover #profilecard #webdesign #frontendmagic #htmlcss #uidesign #hoveranimation #cssonly #devreel #codingtutorial #uianimation
May 5, 2025 at 4:03 PM
javidevedu.bsky.social
Discover how to make your site pop — visit javidev, link in my profile.
Stunning visuals, smooth motion. Web design just leveled up. Let’s code something amazing! mystic.js
#webdesign #frontenddev #cssanimation #htmlcss #uidesign #slidingcard #cssonly #codingreel
May 4, 2025 at 4:02 PM
javidevedu.bsky.social
How to make a circular profile hover effect in HTML & CSS! 🌀
Discover clean web magic with zero JavaScript — visit javidev (link in my profile).
mystic.js

#WebDesign #HTMLTips #CSSOnly #FrontendMagic #CodeSnippet #HoverEffect #DevLife #CleanCode #UIUX #WebDevTutorials
May 11, 2025 at 3:02 PM
ivorjetski.bsky.social
I've got the hobbledehoy movement working in the Backrooms, but I need to work on the interactions with it, because you can't currently press the light-switch. But it's fun to hobble around if you like:

tinydesign.co.uk/css-backroom...

#css #cssart #backrooms #cssonly #purecss
Ben Evans: The Backrooms - CSS Edition
God save you if you hear something wandering around nearby, because it sure as hell has heard you...
tinydesign.co.uk
July 8, 2025 at 11:02 PM