LightNews — News, ranked by scholars

Pablo Lara H.

@pablolarah.bsky.social

📷 Scroll-Driven Photo Gallery #CSSonly
by Chris Bolson @cbolson.bsky.social
at @codepen.io
#PhotoGallery #scrollDriven #css #webdev

codepen.io/editor/cbols...

Screenshot of codepen with text "Scroll-Driven Photo Gallery #CSSonly
Chris Bolson". Below image of building and the Eiffel tower behind. Picture gallery pagination with grey bullets, arrows left and right on every side and blue bullet on active picture.

November 2, 2026 at 8:53 PM

Chris Bolson

@cbolson.bsky.social

Another #CSSonly `::scroll-*` demo!

This one keeps things a little simpler, using scroll markers as tabs and scroll-triggered animations to bring the selected tab’s content to life.

⚠️ Currently only works in Chromium-based browsers.

See the full demo on @codepen.io
codepen.io/editor/cbols...

October 19, 2026 at 8:32 PM

Chris Bolson

@cbolson.bsky.social

Another `:scroll-*` demo — an interactive CSS solar system! 🪐

Advanced `attr()` pulls planet data to define orbits and speeds, while `::scroll-marker` brings the planets to life.

Always fun to see what CSS can do!

See the full demo on @codepen.io

codepen.io/editor/cbols...

#CSSOnly

October 16, 2026 at 4:55 PM

javidevedu

@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

javidevedu

@javidevedu.bsky.social

Make your cards shine — check out more at javidev, link in my profile.
Glow up your design with pure CSS. Let’s light it up! mystic.js
#cardhover #outerglow #cssdesign #htmlcss #uianimation #webdesign #frontenddev #cssonly #devreel #codingtutorial

May 10, 2025 at 10:01 PM

javidevedu

@javidevedu.bsky.social

Serve up sizzling UI design — check out javidev, link in my profile.
Tasty transitions, bold style. Code that hits different. mystic.js
#burgercard #csshover #htmlcss #uianimation #webdesign #frontenddev #hovereffect #cssonly #devreel #codingreels

May 9, 2025 at 4:02 PM

javidevedu

@javidevedu.bsky.social

Transform your profile with style — explore more at javidev, link in my profile.
Hover effects that pop. Make your profile stand out. mystic.js
#profilecard #csshover #htmlcss #uianimation #webdesign #frontenddev #cssonly #codingreels #devreel #uidesign

May 8, 2025 at 10:02 PM

javidevedu

@javidevedu.bsky.social

Make your UI play-ready — see more at javidev, link in my profile.
Dynamic effects for gamers & devs alike. Build it smooth. mystic.js
#gamecard #csshover #gamingui #htmlcss #frontenddev #uianimation #cssonly #webdesign #codingreel #devreel

May 8, 2025 at 4:02 PM

javidevedu

@javidevedu.bsky.social

Add cinematic flair to your UI — see more at javidev, link in my profile.
Dynamic, stylish, and smooth. Your cards deserve the spotlight. mystic.js
#moviecard #csshover #htmlcss #uianimation #webdesign #frontenddev #cinematicui #cssonly #devreel #codingdesign

May 7, 2025 at 10:02 PM

javidevedu

@javidevedu.bsky.social

Give your UI that premium feel — more at javidev, link in my profile.
Crisp, smooth, interactive. Your cards just got cooler. mystic.js
#filtercard #csshover #htmlcss #uianimation #webdesign #frontenddev #hovereffect #cssonly #devreel #codingtutorial

May 7, 2025 at 4:03 PM

javidevedu

@javidevedu.bsky.social

Bring your UI to life in 3D — explore more at javidev, link in my profile.
Sharp angles. Smooth motion. Pure CSS power. mystic.js
#3dhover #triangletransition #cssmagic #htmlcss #uianimation #frontenddev #webdesign #cssonly #codingreel #devreel

May 6, 2025 at 10:02 PM

javidevedu

@javidevedu.bsky.social

Transform your UI with clean effects — explore more at javidev, link in my profile.
From basic to stunning in seconds. Your list elements will thank you. mystic.js
#listhover #cssmagic #frontenddesign #htmlcss #hovereffect #uianimation #cssonly #devreel #codingreels #webdevelopment

May 6, 2025 at 4:03 PM

javidevedu

@javidevedu.bsky.social

Craft epic UI moments — more on javidev, link in my profile.
Blur, depth, motion. Your game cards just got legendary. mystic.js
#gamecard #blureffect #csshover #htmlcss #uianimation #webdesign #frontenddev #cssonly #devreel #gamedevdesign

May 5, 2025 at 10:02 PM

javidevedu

@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

@javidevedu.bsky.social

Clean. Modern. Frosted. See more at javidev, link in my profile.
Perfect for sleek UI vibes — elevate your login screen now. mystic.js
#loginform #glassmorphism #htmlcss #cssdesign #uianimation #webdesign #frontenddev #cssonly #devreel #codingui

May 4, 2025 at 10:02 PM

javidevedu

@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

Álvaro Montoro

@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

Jay

@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

Ben Evans

@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

Ben Evans

@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

Ben Evans

@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

Ben Evans

@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! 🥳