Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

It's amazing how much you can do with CSS these days.

91,315 görüntüleme • 1 yıl önce •via X (Twitter)

32 Yorum

Haz profil fotoğrafı
Haz1 yıl önce

Code:

Bernardo profil fotoğrafı
Bernardo1 yıl önce

Nice! No JS needed is really a must for responsive menu's. Too bad it doesn't work in Firefox though.

Haz profil fotoğrafı
Haz1 yıl önce

Yeah, I didn't write it in CodePen, but it's possible to support Firefox and Safari < 26 by gracefully degrading to a static version without anchor positioning or animation.

Brennan McEachran 👨‍🚀 profil fotoğrafı
Brennan McEachran 👨‍🚀1 yıl önce

You could add an svg filter on that too and get a gooey blob as it goes into/out of the active state. All w/o JS

ImAvibeCoder profil fotoğrafı
ImAvibeCoder1 yıl önce

Designers are spoiled now: colors, motion and layout magic from one file, clients notice.

Ahmed Tawfik profil fotoğrafı
Ahmed Tawfik1 yıl önce

True!, I made this using CSS

Tomer Lerner profil fotoğrafı
Tomer Lerner1 yıl önce

Css is where my most delightful moments in programming at, and where AI is nowhere near the helper it is in other areas of the application. CSS = the last frontier of the bright shining human creativity in development

V I S H A L 🧑🏻‍💻 profil fotoğrafı
V I S H A L 🧑🏻‍💻1 yıl önce

Super cool! 🚀 With @MisakiStudio_ , you can achieve this too—only faster, and directly as React components ready to use.

Benzigar Alvin. profil fotoğrafı
Benzigar Alvin.1 yıl önce

wow, amazing..

Dom Sip profil fotoğrafı
Dom Sip1 yıl önce

Yeah we need a @shadcn equivalent to typical components created only with HTML + CSS. Main use case is MegaNav. The web would be a much better place

Alf | Motion designer profil fotoğrafı
Alf | Motion designer1 yıl önce

Amazing work brother

Jigs profil fotoğrafı
Jigs1 yıl önce

That's like an art 👨🏻‍🎨

yhigorrr (builder arc) profil fotoğrafı
yhigorrr (builder arc)1 yıl önce

wow.

Nitish profil fotoğrafı
Nitish1 yıl önce

The Fact is people uses js for things that can be possible with css only

Danish Mehrab 🌟 profil fotoğrafı
Danish Mehrab 🌟1 yıl önce

That's nice. 👌

Israel profil fotoğrafı
Israel1 yıl önce

Great work 👏 👍

Ahmet the Cursebearer profil fotoğrafı
Ahmet the Cursebearer1 yıl önce

Unfortunately Firefox does not support anchor()

Xiu profil fotoğrafı
Xiu1 yıl önce

Anchor is a magical thing. He should become a standard css.

Naelo — 🇪🇺 eu/acc profil fotoğrafı
Naelo — 🇪🇺 eu/acc1 yıl önce

Tailwind/radix variant?

Dovy profil fotoğrafı
Dovy1 yıl önce

very clean 👌

at5 profil fotoğrafı
at51 yıl önce

@leodebar38842 👀

Elyakim profil fotoğrafı
Elyakim1 yıl önce

Beautiful & Beneficial.

Nizam profil fotoğrafı
Nizam1 yıl önce

wow, awesome

Hypno profil fotoğrafı
Hypno1 yıl önce

Liquid glass? Nah, we got solid glass

Utsav Ladani profil fotoğrafı
Utsav Ladani1 yıl önce

Yeah, CSS is evolving in a great way. Many popular UI patterns can be achieved just using HTML and CSS.

Andrey profil fotoğrafı
Andrey1 yıl önce

beatiful

freddie profil fotoğrafı
freddie1 yıl önce

without anchor-scope the amount of hacks needed to ensure adding two of the same radio group won’t lead to weird behaviours is annoyingly big but it’s coming!

Eric profil fotoğrafı
Eric1 yıl önce

I used to code this for projects when AI doesn’t exist. I can share my old codes

Frédéric BERRIA profil fotoğrafı
Frédéric BERRIA1 yıl önce

Sweet.

origami profil fotoğrafı
origami1 yıl önce

def stealing. thnx for the snippet

mateja profil fotoğrafı
mateja1 yıl önce

it looks nice for post on twitter, but for actual purpose, having 2 buttons in some kind of similar state may be very confusing to potential users

Ziyad profil fotoğrafı
Ziyad1 yıl önce

It's sad that many won't know because people will use any tool to avoid writing css, tailwind css-in-js you name it

Benzer Videolar