Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

CSS shape() landed in Firefox 148. It's similar to path(), but allows the full expressiveness of CSS…

FirefoxWebDevs's profile picture

Firefox for Web Developers

90,223 subscribers

11,375 görüntüleme • 5 ay önce •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

Updated my SVG-to-CSS converter to support multiple path elements. An easy way to convert complex SVG shapes into CSS. It's a single-element implementation with a single shape() value! You can also have the border-only version using border-shape.
0:34

Updated my SVG-to-CSS converter to support multiple path elements. An easy way to convert complex SVG shapes into CSS. It's a single-element implementation with a single shape() value! You can also have the border-only version using border-shape.

CSS by T. Afif

15,196 görüntüleme • 4 ay önce

squircles feels nice. it's my first time trying the experimental css `corner-shape` property. you can just use in css `corner-shape: squircle` to make the squircles. had enough fun working on this control panel component. note: this is only support on "chromium" for now.
0:29

squircles feels nice. it's my first time trying the experimental css `corner-shape` property. you can just use in css `corner-shape: squircle` to make the squircles. had enough fun working on this control panel component. note: this is only support on "chromium" for now.

Soren

97,796 görüntüleme • 7 ay önce

Suuuper handy new CSS: :user-invalid and :user-valid pseudo selectors let you style inputs only once they have been interacted with Just landed in Chrome + Safari, been in Firefox for years.
1:19

Suuuper handy new CSS: :user-invalid and :user-valid pseudo selectors let you style inputs only once they have been interacted with Just landed in Chrome + Safari, been in Firefox for years.

Wes Bos

177,399 görüntüleme • 2 yıl önce

JavaScript Iterator․zip landed in Firefox 148, making it simple to loop over multiple things at the same time. Here's how it works:
1:45

JavaScript Iterator․zip landed in Firefox 148, making it simple to loop over multiple things at the same time. Here's how it works:

Firefox for Web Developers

11,958 görüntüleme • 5 ay önce

The open-source library of CSS motion effects, Kinetics, now contains 99 motion effects. You can copy CSS to the clipboard or the prompt so it's easy to replicate in your AI tool.
0:51

The open-source library of CSS motion effects, Kinetics, now contains 99 motion effects. You can copy CSS to the clipboard or the prompt so it's easy to replicate in your AI tool.

Csaba Kissi

105,818 görüntüleme • 1 ay önce

I did it! 100 Unique CSS Patterns 🤩 👉 👈 One of the biggest collection of CSS patterns ever! ✅ One-click to copy/paste ✅ One value to control the size ✅ Optimized with CSS variables Which one is your favorite? Tell me in the comments 👇 #CSS
0:23

I did it! 100 Unique CSS Patterns 🤩 👉 👈 One of the biggest collection of CSS patterns ever! ✅ One-click to copy/paste ✅ One value to control the size ✅ Optimized with CSS variables Which one is your favorite? Tell me in the comments 👇 #CSS

CSS by T. Afif

29,170 görüntüleme • 3 yıl önce

💡CSS Tip! Connecting two circles with an arrow is good, but it's even better if we can calculate and show the distance inside the arrow! 👀 Another cool demo powered by the future of CSS.
0:22

💡CSS Tip! Connecting two circles with an arrow is good, but it's even better if we can calculate and show the distance inside the arrow! 👀 Another cool demo powered by the future of CSS.

CSS by T. Afif

25,843 görüntüleme • 7 ay önce

In graph theory, there are algorithms that find the shortest path between two nodes. I made one with pure CSS (including the graph drawing). Drag the nodes, and the shortest path will update in real-time! A demo powered by all the modern CSS features🤩
0:36

In graph theory, there are algorithms that find the shortest path between two nodes. I made one with pure CSS (including the graph drawing). Drag the nodes, and the shortest path will update in real-time! A demo powered by all the modern CSS features🤩

CSS by T. Afif

1,201,004 görüntüleme • 6 ay önce

🤯 Just 4 lines of CSS View Transitions are great for changing pages BUT it's incredible for animating any changes to the DOM
3:51

🤯 Just 4 lines of CSS View Transitions are great for changing pages BUT it's incredible for animating any changes to the DOM

Wes Bos

149,091 görüntüleme • 1 yıl önce

Published a plugin! It allows you to copy CSS variables from Figma in either design or dev mode 🧑‍💻
1:01

Published a plugin! It allows you to copy CSS variables from Figma in either design or dev mode 🧑‍💻

luis.

12,061 görüntüleme • 1 yıl önce

here is the new CSS Border shape API this is going to unlock so many sick new designs
1:55

here is the new CSS Border shape API this is going to unlock so many sick new designs

Wes Bos

109,486 görüntüleme • 3 ay önce

Probably old news now, but the CSS View Transition API is SUPER cool! Entry/exit layout animations like this used to be super complicated or require giant libraries. Now it's like 2 lines of JS, and a few lines of CSS if you want to customize the animation. Amazing! 🤯
0:29

Probably old news now, but the CSS View Transition API is SUPER cool! Entry/exit layout animations like this used to be super complicated or require giant libraries. Now it's like 2 lines of JS, and a few lines of CSS if you want to customize the animation. Amazing! 🤯

Devon Govett

98,021 görüntüleme • 2 yıl önce

🌍Seeing the world outside of Tiangong Space Station (CSS). Full HD:
0:48

🌍Seeing the world outside of Tiangong Space Station (CSS). Full HD:

CNSA Watcher

285,472 görüntüleme • 3 yıl önce

Clay's transition API is starting to shape up. It's modeled on the simplicity of CSS transitions (i.e. just specify property, duration and tween function, the rest is automatic) but with the ability to override the tween function so you can do whatever you want, frame by frame.
0:22

Clay's transition API is starting to shape up. It's modeled on the simplicity of CSS transitions (i.e. just specify property, duration and tween function, the rest is automatic) but with the ability to override the tween function so you can do whatever you want, frame by frame.

Nic Barker

13,982 görüntüleme • 1 yıl önce

there's a drop-in CSS library in the style of windows 98
0:21

there's a drop-in CSS library in the style of windows 98

Aiden Bai

295,190 görüntüleme • 1 yıl önce