正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

The subtle differences when creating a squircle 🧐 Use a generated CSS clip-path to get a finer shape 🤙 .squircle { clip-path: polygon( 100.00% 50.00%, 99.95% 62.53%, 99.80% 67.70%, ... ); } Went down the rabbit hole 🐇

jhey ▲🐻🎈

128,936 subscribers

87,803 次观看 • 1 年前 •via X (Twitter)

艺术教育科学技术

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

css trick for the "shine" border 🧑‍🍳 take a pseudoelement position + give it an inset box-shadow mask it off at an angle with a linear-gradient 🤙 bonus: use corner-shape: squircle + rotate on pointer move

css trick for the "shine" border 🧑‍🍳 take a pseudoelement position + give it an inset box-shadow mask it off at an angle with a linear-gradient 🤙 bonus: use corner-shape: squircle + rotate on pointer move

jhey ʕ•ᴥ•ʔ

200,156 次观看 • 6 个月前

I've built an app to play around with the new CSS squircle feature. →

I've built an app to play around with the new CSS squircle feature. →

Jim Raptis

27,748 次观看 • 4 个月前

one way w/ css 🪄 stack an image 2x filter 1st, unclip 2nd on :hover 🤙 a img { grid-area: 1 / 1; } img:first-of-type { filter: grayscale(1) invert(1); } img:last-of-type { clip-path: circle(0); transition: clip-path; } a:hover img:last-of-type { clip-path: circle(100%); }

one way w/ css 🪄 stack an image 2x filter 1st, unclip 2nd on :hover 🤙 a img { grid-area: 1 / 1; } img:first-of-type { filter: grayscale(1) invert(1); } img:last-of-type { clip-path: circle(0); transition: clip-path; } a:hover img:last-of-type { clip-path: circle(100%); }

jhey ʕ•ᴥ•ʔ

301,270 次观看 • 3 个月前

UI && CSS Tip! 🚀 You can use View Transitions to create that Radix by WorkOS style theme switcher 👀 ::view-transition-new(root) { animation: reveal;} keyframes reveal { 0% { clip-path: polygon(...);} /* Code 👇 */ } Animate clip-path between modes 😍 CodePen.IO link below! 👇

UI && CSS Tip! 🚀 You can use View Transitions to create that Radix by WorkOS style theme switcher 👀 ::view-transition-new(root) { animation: reveal;} keyframes reveal { 0% { clip-path: polygon(...);} /* Code 👇 */ } Animate clip-path between modes 😍 CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

232,919 次观看 • 2 年前

It's not a square. ⬛🙅‍♂️ It's not a circle. ⚫🙅‍♀️ It's a squircle! In Flutter 3.32, we've introduced a new addition to Flutter’s shape capabilities: the rounded superellipse, a cornerstone of the iOS design language.

It's not a square. ⬛🙅‍♂️ It's not a circle. ⚫🙅‍♀️ It's a squircle! In Flutter 3.32, we've introduced a new addition to Flutter’s shape capabilities: the rounded superellipse, a cornerstone of the iOS design language.

Flutter

25,402 次观看 • 1 年前

First instinct when I saw the forced squircle icons in macOS 26 Tahoe: clip everything that sticks out and bring it back with NSApplication.shared.dockTile.contentView at launch. #WWDC25

First instinct when I saw the forced squircle icons in macOS 26 Tahoe: clip everything that sticks out and bring it back with NSApplication.shared.dockTile.contentView at launch. #WWDC25

Simon B. Støvring

173,746 次观看 • 1 年前

In Figma Design you can easily cut up a shape with a path using the shape builder tool, without moving over to draw! 🤯 Just draw the path you want to use to "Cut." Just select your object and path and press "M," and click your regions. #FigmaTip

In Figma Design you can easily cut up a shape with a path using the shape builder tool, without moving over to draw! 🤯 Just draw the path you want to use to "Cut." Just select your object and path and press "M," and click your regions. #FigmaTip

miggi from figma

243,080 次观看 • 9 个月前

Down the Bitcoin Rabbit Hole 🕳️🐇

Down the Bitcoin Rabbit Hole 🕳️🐇

Lucho

65,965 次观看 • 3 年前

down the rabbit hole we go ... 🐇

Sensitive content

down the rabbit hole we go ... 🐇

Gamer Supps®

1,396,491 次观看 • 2 年前

Dog creating a path from walking the same everyday

Dog creating a path from walking the same everyday

non aesthetic things

2,704,384 次观看 • 2 年前

I went down a rabbit hole and ended finding this.

I went down a rabbit hole and ended finding this.

Mr. Baldimore

409,564 次观看 • 6 个月前

BANNON: The military is moving down a path to deindustrialize Iran.

BANNON: The military is moving down a path to deindustrialize Iran.

Bannon’s WarRoom

17,201 次观看 • 2 个月前

`clip-path` buttons

`clip-path` buttons

Jakub Krehel

40,745 次观看 • 6 个月前

Went down an NBL rabbit hole last night and came across the most outrageous use of a smoke machine I’ve ever seen in my life lmao

Went down an NBL rabbit hole last night and came across the most outrageous use of a smoke machine I’ve ever seen in my life lmao

Jalin Troutman

327,859 次观看 • 1 个月前

Need a gradient border? Use CSS background-clip 🤙 input { background: linear-gradient(canvas, canvas), linear-gradient(120deg, hsl(278, 44%, 73%), hsl(35, 81%, 73%) ); border: 4px solid transparent; background-clip: padding-box, border-box; }

Need a gradient border? Use CSS background-clip 🤙 input { background: linear-gradient(canvas, canvas), linear-gradient(120deg, hsl(278, 44%, 73%), hsl(35, 81%, 73%) ); border: 4px solid transparent; background-clip: padding-box, border-box; }

jhey ʕ•ᴥ•ʔ

82,376 次观看 • 2 年前

💡 Do you know about the `clip` value? In CSS, we can clip a container along a single axis by using the `clip` value. Learn more in this interactive article about the `clip` value:

💡 Do you know about the `clip` value? In CSS, we can clip a container along a single axis by using the `clip` value. Learn more in this interactive article about the `clip` value:

Ahmad Shadeed

10,451 次观看 • 1 年前

Went down a gender reveal rabbit hole last night starting with this reveal from a few years ago that killed the pilot

Went down a gender reveal rabbit hole last night starting with this reveal from a few years ago that killed the pilot

Kristi Yamaguccimane

166,064 次观看 • 3 个月前

clip-path is really underrated

clip-path is really underrated

dmytro

59,745 次观看 • 8 个月前

I went down a restaurant interior design rabbit hole yesterday and this is what it felt like watching everything get less colorful and simpler through the years

I went down a restaurant interior design rabbit hole yesterday and this is what it felt like watching everything get less colorful and simpler through the years

The Art of SpongeBob

55,749 次观看 • 10 个月前

Just made my first 10-second Grok clip. Be the penguin. Walk the vertical path.

Just made my first 10-second Grok clip. Be the penguin. Walk the vertical path.

Ian Miles Cheong

39,513 次观看 • 4 个月前