Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
What I Learned About SVG
Search
Rachel Ober
February 21, 2014
Programming
0
43
What I Learned About SVG
Rachel Ober
February 21, 2014
Tweet
Share
More Decks by Rachel Ober
See All by Rachel Ober
So, You Want to Organize a Conference
rachelober
0
43
Front End Workshop 2015
rachelober
0
63
Front End Overview for Interns 2015
rachelober
1
38
IE Classes
rachelober
0
44
Front End Overview (2014)
rachelober
0
38
Team Communication Through Code
rachelober
0
68
Responsive Emails
rachelober
0
37
Paperless Post Sass
rachelober
1
79
SassConf Custom Framework/Style Guide Panel
rachelober
0
95
Other Decks in Programming
See All in Programming
ペアーズでの、Langfuseを中心とした評価ドリブンなリリースサイクルのご紹介
fukubaka0825
2
300
Spring gRPC について / About Spring gRPC
mackey0225
0
220
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
270
Honoのおもしろいミドルウェアをみてみよう
yusukebe
1
200
DROBEの生成AI活用事例 with AWS
ippey
0
130
『GO』アプリ バックエンドサーバのコスト削減
mot_techtalk
0
130
Grafana Cloudとソラカメ
devoc
0
140
『GO』アプリ データ基盤のログ収集システムコスト削減
mot_techtalk
0
110
ISUCON14公式反省会LT: 社内ISUCONの話
astj
PRO
0
180
Pulsar2 を雰囲気で使ってみよう
anoken
0
230
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
770
Compose でデザインと実装の差異を減らすための取り組み
oidy
1
300
Featured
See All Featured
Java REST API Framework Comparison - PWX 2021
mraible
28
8.4k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.3k
Git: the NoSQL Database
bkeepers
PRO
427
64k
How to Ace a Technical Interview
jacobian
276
23k
Six Lessons from altMBA
skipperchong
27
3.6k
The World Runs on Bad Software
bkeepers
PRO
67
11k
We Have a Design System, Now What?
morganepeng
51
7.4k
Practical Orchestrator
shlominoach
186
10k
Why Our Code Smells
bkeepers
PRO
335
57k
Bash Introduction
62gerente
610
210k
Music & Morning Musume
bryan
46
6.3k
How to Think Like a Performance Engineer
csswizardry
22
1.3k
Transcript
What I learned about SVG In 5 minutes or less
Scalable Vector Graphics
Goal: Provide both a retina and non-retina solution for our
graphic needs.
None
Product Design
None
120 Lines of Code
120 Lines of Code - 11KB
96 Lines of Code - 9KB
96 Lines of Code - 9KB
None
5 Paths - 8KB
5 Paths - 8KB dramatization of actual events
#svg-full-logo { height: 26px; width: 49px; path { fill: #777;
} } To Manipulate Inline SVG with CSS
None
None
Tips Tricks Gotchas • CSS can only be used on
an inline SVG, not an SVG embedded as an <img> • There’s a new Rails Helper for that! • Need to make sure it has a view port size • Add a class for each path/shape • Preferably add an id for the main SVG