Загрузка видео...

Не удалось загрузить видео

На главную

Pinterest moved to native CSS carousels to replace legacy JS platform-wide → Using CSS primitives like scroll markers and snap, they achieved: 📉 90% code reduction (2k JS → 200 CSS) 🚀 15% faster page loads ✨ Smoother, interactive UI

ChromiumDev's profile picture

Chrome for Developers

420,220 subscribers

219,689 просмотров • 3 месяцев назад •via X (Twitter)

Новости и политикаНаука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

Carousels just got a major glow up 💅 New CSS primitives let you build carousels that are interactive at first paint. Easily add native scroll buttons, scroll markers, & scroll snap effects to turn a simple layout into a full story →
1:26

Carousels just got a major glow up 💅 New CSS primitives let you build carousels that are interactive at first paint. Easily add native scroll buttons, scroll markers, & scroll snap effects to turn a simple layout into a full story →

Chrome for Developers

46,450 просмотров • 6 месяцев назад

Can we please stop with the scroll-jacking carousels on websites? CSS Scroll Snap is a much better solution! Re-built the Uniqlo home page with 6 lines of CSS and 4 lines of JS
2:35

Sensitive content

Can we please stop with the scroll-jacking carousels on websites? CSS Scroll Snap is a much better solution! Re-built the Uniqlo home page with 6 lines of CSS and 4 lines of JS

Wes Bos

305,169 просмотров • 1 год назад

🚀 Introducing Panda CSS The modern CSS-in-JS styling engine! Say goodbye to runtime CSS-in-JS 🎨💪✨ 🔸Works with Server Components 🔸Recipes, Variants, and Patterns 🔸Design Tokens Support Works in Next.js, Vue, Qwik, Solid, Astro, and more.
1:11

🚀 Introducing Panda CSS The modern CSS-in-JS styling engine! Say goodbye to runtime CSS-in-JS 🎨💪✨ 🔸Works with Server Components 🔸Recipes, Variants, and Patterns 🔸Design Tokens Support Works in Next.js, Vue, Qwik, Solid, Astro, and more.

Sage ⚡️

413,377 просмотров • 3 лет назад

Understanding HTML, CSS and JS 🤌🏽
2:30

Understanding HTML, CSS and JS 🤌🏽

Ugwu Samuel 👨🏼‍💻

38,083 просмотров • 1 год назад

Responsive login form with fun animation ✨ Using HTML, CSS and JS. CodePen link below 👇
0:20

Responsive login form with fun animation ✨ Using HTML, CSS and JS. CodePen link below 👇

Viki ✨

401,492 просмотров • 2 лет назад

Make your web UI roar-some 🦖 Swap complex JS for just a few lines of CSS to build carousels and bring animations to life. Now available in Chrome and coming soon to other browsers →
0:22

Make your web UI roar-some 🦖 Swap complex JS for just a few lines of CSS to build carousels and bring animations to life. Now available in Chrome and coming soon to other browsers →

Chrome for Developers

43,046 просмотров • 6 месяцев назад

😎👋As promised, I've recreated it on @codepen ✨ I loved making it & animating the gradients🌈 Using: - CSS keyframes ✅ - CSS custom properties ✅ - CSS variables ✅ - NO JS ❌ Link: CrossBrowser incoming ➡️ #css #FrontEndDev
0:26

😎👋As promised, I've recreated it on @codepen ✨ I loved making it & animating the gradients🌈 Using: - CSS keyframes ✅ - CSS custom properties ✅ - CSS variables ✅ - NO JS ❌ Link: CrossBrowser incoming ➡️ #css #FrontEndDev

Luky - A$AP Luky

103,277 просмотров • 3 лет назад

A cute lamp login page, made with HTML, CSS, JS😱🥹
0:25

A cute lamp login page, made with HTML, CSS, JS😱🥹

F.O.L.A

48,759 просмотров • 4 месяцев назад

successful day of UI design! really starting to feel the benefit of writing plugin UIs in html/css/js
0:38

successful day of UI design! really starting to feel the benefit of writing plugin UIs in html/css/js

imagiro

10,260 просмотров • 2 лет назад

Prompt: Make a game like flappy bird using HTML/CSS/JS in a single HTML file
2:13

Prompt: Make a game like flappy bird using HTML/CSS/JS in a single HTML file

Diego | AI 🚀 - e/acc

145,468 просмотров • 6 месяцев назад

Future CSS Tip! 🔮 You can power list animations like you would using IntersectionObserver with CSS scroll-driven animations and zero JS 🤯 el { animation: show; animation-timeline: view(); animation-range: entry; } keyframes show {0%{translate:0 50%;}} CodePen.IO link below! 👇
0:54

Future CSS Tip! 🔮 You can power list animations like you would using IntersectionObserver with CSS scroll-driven animations and zero JS 🤯 el { animation: show; animation-timeline: view(); animation-range: entry; } keyframes show {0%{translate:0 50%;}} CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

433,664 просмотров • 2 лет назад

converted a JS physics solver into CSS thanks to sqrt(), exp(), sin(), cos() and property
0:34

converted a JS physics solver into CSS thanks to sqrt(), exp(), sin(), cos() and property

Adam Argyle

15,093 просмотров • 2 лет назад

What I coded today as a software engineer! HTML/CSS/JS edition ✨
1:23

What I coded today as a software engineer! HTML/CSS/JS edition ✨

˗ˏˋmewtru´ˎ˗

212,770 просмотров • 2 лет назад

Animation for a Halloween Ghost with CSS and JS 🎃👻
0:24

Animation for a Halloween Ghost with CSS and JS 🎃👻

Viki ✨

337,079 просмотров • 2 лет назад

Twitter UI is a beast to style. Responsive is still rough, ended up using grid for the 3 main columns. Using Tailwind CSS and Next JS for components. Will deploy to Vercel when ready
0:24

Twitter UI is a beast to style. Responsive is still rough, ended up using grid for the 3 main columns. Using Tailwind CSS and Next JS for components. Will deploy to Vercel when ready

Roy Quilor

65,130 просмотров • 3 лет назад

Prompt: Make a side-scrolling platformer game like Super Mario Bros. using HTML/CSS/JS in a single HTML file.
1:53

Prompt: Make a side-scrolling platformer game like Super Mario Bros. using HTML/CSS/JS in a single HTML file.

Diego | AI 🚀 - e/acc

84,803 просмотров • 6 месяцев назад

CSS + JSで実現する、Apple WatchっぽいUI。 境界付近でCSSのscaleを変化させるのがポイント。
0:36

CSS + JSで実現する、Apple WatchっぽいUI。 境界付近でCSSのscaleを変化させるのがポイント。

池田 泰延

157,899 просмотров • 9 месяцев назад

Future CSS Tip! 🔮 Anchor Positioning lets you anchor elements to others with CSS alone 👍 It can also work out positioning if an element gets clipped by a container, window, etc. Think "Common floating UI uses with no JS" 🤯 .el { bottom: anchor(--link top); } Just CSS 👇
0:36

Future CSS Tip! 🔮 Anchor Positioning lets you anchor elements to others with CSS alone 👍 It can also work out positioning if an element gets clipped by a container, window, etc. Think "Common floating UI uses with no JS" 🤯 .el { bottom: anchor(--link top); } Just CSS 👇

jhey ʕ•ᴥ•ʔ

160,545 просмотров • 3 лет назад

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖
2:08

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖

Shefali

22,953 просмотров • 1 год назад

curved scrollbar 👨‍🍳 powered by GSAP + CSS scroll-snap + SVG
0:40

curved scrollbar 👨‍🍳 powered by GSAP + CSS scroll-snap + SVG

jhey ʕ•ᴥ•ʔ

97,915 просмотров • 1 год назад