Upgrade to Pro — share decks privately, control downloads, hide ads and more …

TIL about clipping

Avatar for Gunnar Bittersmann Gunnar Bittersmann
March 29, 2021
Programming
0
29

TIL about clipping

Avatar for Gunnar Bittersmann

Gunnar Bittersmann

March 29, 2021
Tweet

More Decks by Gunnar Bittersmann

See All by Gunnar Bittersmann
Responsive typography 2
Avatar for Gunnar Bittersmann gunnarbittersmann
0
130
Go home, Prettifier, you’re drunk!!
Avatar for Gunnar Bittersmann gunnarbittersmann
0
86
3 Fehler sind zu finden
Avatar for Gunnar Bittersmann gunnarbittersmann
0
140
TIL that the future :has already begun
Avatar for Gunnar Bittersmann gunnarbittersmann
0
99
TIL how to clear floats
Avatar for Gunnar Bittersmann gunnarbittersmann
0
93
TIL about showModal (from small things big things one day come)
Avatar for Gunnar Bittersmann gunnarbittersmann
0
110
Inclusive Design 24 2022 – Gunnar’s picks
Avatar for Gunnar Bittersmann gunnarbittersmann
0
94
The color rebeccapurple
Avatar for Gunnar Bittersmann gunnarbittersmann
0
150
Mehrsprachige Websites
Avatar for Gunnar Bittersmann gunnarbittersmann
0
96

Other Decks in Programming

See All in Programming
すべてのコンテキストを、 ユーザー価値に変える
Avatar for Michiru Kato applism118
4
1.4k
Goで作る、開発・CI環境
Avatar for Shinpei Mine sin392
0
260
チームで開発し事業を加速するための"良い"設計の考え方 @ サポーターズCoLab 2025-07-08
Avatar for Agata Naomichi agatan
1
450
#QiitaBash MCPのセキュリティ
Avatar for Tommy(sigma) ryosukedtomita
1
1.5k
スタートアップの急成長を支えるプラットフォームエンジニアリングと組織戦略
Avatar for Yusuke Suto sutochin26
1
6.7k
なぜ「共通化」を考え、失敗を繰り返すのか
Avatar for Rinchoku rinchoku
1
670
Deep Dive into ~/.claude/projects
Avatar for Yuya Hirayama hiragram
14
11k
生成AI時代のコンポーネントライブラリの作り方
Avatar for touyou touyou
1
260
ご注文の差分はこちらですか？ 〜 AWS CDK のいろいろな差分検出と安全なデプロイ
Avatar for Kenji Kono konokenj
3
470
顧客の画像データをテラバイト単位で配信する 画像サーバを WebP にした際に起こった課題と その対応策 ～継続的な取り組みを添えて～
Avatar for Takuya TAKAHASHI takutakahashi
1
310
CDK引数設計道場100本ノック
Avatar for kazuho cryer-shinozuka badmintoncryer
2
360
AI時代の『改訂新版 良いコード／悪いコードで学ぶ設計入門』 / ai-good-code-bad-code
Avatar for MinoDriven minodriven
22
9k

Featured

See All Featured
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
346
40k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
53
7.7k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
1
440
Put a Button on it: Removing Barriers to Going Fast.
Avatar for kastner kastner
60
3.9k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
331
22k
How GitHub (no longer) Works
Avatar for Zach Holman holman
314
140k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
126
53k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
71
11k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
524
40k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.5k
Docker and Python
Avatar for Tania Allard trallard
45
3.5k

Transcript

  1. TIL about clipping

  2. Photo by Flavio Gasperini on Unsplash

  3. None

  4. <defs> <mask id="x"> <rect width="3000" height="630" fill="white"!" <ellipse cx="1510" cy="411"

    rx="220" ry="214" fill="black" stroke="none"!" !#mask> !#defs> <g mask="url(#x)">

  5. <defs> <clipPath id="x"> <rect width="3000" height="630" fill="white"!" <ellipse cx="1510" cy="411"

    rx="220" ry="214" fill="black" stroke="none"!" !#clipPath> !#defs> <g clip path="url(#x)">

  6. “

  7. <defs> <clipPath id="x"> <path d="................................................................ ................................................................"!" !#clipPath> !#defs> <g clip-path="url(#x)">

  8. Photo by Flavio Gasperini on Unsplash