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
41
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
190
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
220
Mehrsprachige Websites
Avatar for Gunnar Bittersmann gunnarbittersmann
0
140

Other Decks in Programming

See All in Programming
AI主導のプログラミング学習アプリを作ってみた
Avatar for econanringo econanringo
0
180
PumaからFalconに移行したRailsアプリケーションでの実践
Avatar for Hayato OKUMOTO falcon8823
0
170
AWS CDKのカスタムリソースでContinuum（旧Security Agent）を実装した話 | Implementing Continuum (formerly Security Agent) via AWS CDK Custom Resource
Avatar for アキキー | Akihisa Ikeda akihisaikeda
2
150
Kotlinの15年とServer-Side Kotlin
Avatar for Takehata Naoto n_takehata
1
150
全ての永続トークンを、生まれる前に消し去りたい！
Avatar for sylph01 sylph01
2
880
UnityでSystem.Net.WebSocketsなWebSocketサーバが動かないのでUnity Monoのコードを覗いてみた / about implementing websocket server with unity mono
Avatar for にー兄さん drumath2237
1
610
golang-bob.pdf
Avatar for Yura Iwatsuka iwatsukayura
0
130
SalesForceを内製化！？ ~ HR事業を支える顧客管理基盤のインフラを大公開 ~
Avatar for Kobujee_53 oku053
0
180
contenteditable と日本語入力に向き合う
Avatar for taki colorful12
0
200
現場と育てるRailsモデリング 〜Spreadsheetから始めたモデル設計〜
Avatar for siroemk siroemk
2
590
R8 の設定見直しでアプリサイズ削減
Avatar for ANDPAD inc andpad
0
220
Herb in Rails 8.2: Your ERB views, now HTML-aware @ Rails World 2026, Austin, Texas
Avatar for Marco Roth marcoroth
0
220

Featured

See All Featured
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
2.2k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
Avatar for Aleyda Solis aleyda
2
12k
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
Avatar for Katarina Dahlin katarinadahlin
PRO
3
3.9k
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
Avatar for Kenny Baas-Schwegler baasie
1
570
Reality Check: Gamification 10 Years Later
Avatar for Sebastian Deterding codingconduct
0
2.3k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8.4k
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
550
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
2
2.2k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.4k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
460
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
620

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