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
30

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
140
Go home, Prettifier, you’re drunk!!
Avatar for Gunnar Bittersmann gunnarbittersmann
0
95
3 Fehler sind zu finden
Avatar for Gunnar Bittersmann gunnarbittersmann
0
170
TIL that the future :has already begun
Avatar for Gunnar Bittersmann gunnarbittersmann
0
110
TIL how to clear floats
Avatar for Gunnar Bittersmann gunnarbittersmann
0
100
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
96
The color rebeccapurple
Avatar for Gunnar Bittersmann gunnarbittersmann
0
160
Mehrsprachige Websites
Avatar for Gunnar Bittersmann gunnarbittersmann
0
100

Other Decks in Programming

See All in Programming
Pythonに漸進的に型をつける
Avatar for Nealle nealle
1
110
スキーマ駆動で、Zod OpenAPI Honoによる、API開発するために、Hono Takibiというライブラリを作っている
Avatar for N Akita nakita628
0
300
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
Avatar for Masahiro Nishimi masahiro_nishimi
3
12k
エンジニアインターン「Treasure」とHonoの2年、そして未来へ / Our Journey with Hono Two Years at Treasure and Beyond
Avatar for CARTA Engineering carta_engineering
0
410
『毎日の移動』を支えるGoバックエンド内製開発
Avatar for yutautsugi yutautsugi
2
270
alien-signals と自作 OSS で実現する フレームワーク非依存な ロジック共通化の探求 / Exploring Framework-Agnostic Logic Sharing with alien-signals and Custom OSS
Avatar for aose aoseyuu
2
150
monorepo の Go テストをはやくした〜い！~最小の依存解決への道のり~ / faster-testing-of-monorepos
Avatar for convto convto
2
520
CSC509 Lecture 07
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
240
Devvox Belgium - Agentic AI Patterns
Avatar for Kevin Dubois kdubois
1
140
contribution to astral-sh/uv
Avatar for Shunsuke Tsuchiya shunsock
0
450
NixOS + Kubernetesで構築する自宅サーバーのすべて
Avatar for ichi-h ichi_h3
0
1.1k
登壇は dynamic! な営みである / speech is dynamic
Avatar for Daichi KUDO da1chi
0
350

Featured

See All Featured
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
59
9.6k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
161
23k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
10
610
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
280
24k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
9
930
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
209
24k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
37
2.9k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
190
11k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.6k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
23k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7.2k
Designing for Performance
Avatar for Lara Hogan lara
610
69k

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