Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

TIL about clipping

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

TIL about clipping

Avatar for Gunnar Bittersmann

Gunnar Bittersmann

March 29, 2021

More Decks by Gunnar Bittersmann

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

Other Decks in Programming

See All in Programming
Building an Out-of-Order CPU
Avatar for Latte72 latte72
1
800
Family mrubyの進捗
Avatar for Katsuhiko Kageyama kishima
1
130
Webの地図
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
6
4.7k
標準パッケージに uuid が追加された 背景から見る Go らしい意思決定 / go_127_uuid_decision
Avatar for convto convto
5
8.2k
IBM Bob Dojo #1 仕様駆動開発入門
Avatar for Akira Onishi (IBM) oniak3ibm
PRO
0
170
海上で動くGoサーバー: goroutineとchannelでさばく航行データストリーム
Avatar for Atsuki Seo atsuki_seo
0
910
スマートフォンでモールス信号を送受信する 〜スマートフォンのLEDとカメラで作る光通信の設計と実装〜
Avatar for Atsuki Seo atsuki_seo
0
170
仕様駆動開発による爆速プロダクト開発 / Bakusoku Spec Driven Development
Avatar for Keisuke Kobayashi kobakei
0
130
SREの越境 / SRE Collaboration
Avatar for y-ohgi y0hgi
2
270
SONY CISC-NEWS NWS-1750 + NWB-225 フレームバッファの NetBSD/news68k ドライバ実装 / OSC2026Hiroshima
Avatar for Izumi Tsutsui tsutsui
0
140
Java 27新機能 / Java 27 new features
Avatar for Naoki Kishida kishida
2
160
スマート反転とウェブアクセシビリティ
Avatar for KAMIHARA Takumi camiha
0
210

Featured

See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
74
42k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
1
460
Building AI with AI
Avatar for Ines Montani inesmontani
PRO
1
1.2k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
1k
Visualization
Avatar for Eitan Lees eitanlees
152
17k
Mind Mapping
Avatar for Hélio Medeiros helmedeiros
1
370
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
530
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
440
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
320
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
600
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
356
21k

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