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
49
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
51
Front End Workshop 2015
rachelober
0
67
Front End Overview for Interns 2015
rachelober
1
47
IE Classes
rachelober
0
49
Front End Overview (2014)
rachelober
0
46
Team Communication Through Code
rachelober
0
73
Responsive Emails
rachelober
0
41
Paperless Post Sass
rachelober
1
89
SassConf Custom Framework/Style Guide Panel
rachelober
0
100
Other Decks in Programming
See All in Programming
時間軸から考えるTerraformを使う理由と留意点
fufuhu
16
4.8k
楽して成果を出すためのセルフリソース管理
clipnote
0
190
Navigation 2 を 3 に移行する(予定)ためにやったこと
yokomii
0
350
ユーザーも開発者も悩ませない TV アプリ開発 ~Compose の内部実装から学ぶフォーカス制御~
taked137
0
190
個人軟體時代
ethanhuang13
0
330
機能追加とリーダー業務の類似性
rinchoku
2
1.3k
ファインディ株式会社におけるMCP活用とサービス開発
starfish719
0
2.1k
Compose Multiplatform × AI で作る、次世代アプリ開発支援ツールの設計と実装
thagikura
0
170
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
120
個人開発で徳島大学生60%以上の心を掴んだアプリ、そして手放した話
akidon0000
1
150
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
420
Azure SRE Agentで運用は楽になるのか?
kkamegawa
0
2.5k
Featured
See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Statistics for Hackers
jakevdp
799
220k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
Music & Morning Musume
bryan
46
6.8k
Documentation Writing (for coders)
carmenintech
74
5k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
The Cost Of JavaScript in 2023
addyosmani
53
8.9k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Producing Creativity
orderedlist
PRO
347
40k
How to Think Like a Performance Engineer
csswizardry
26
1.9k
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