simurai
simurai.com · Personal blog · on HN since 2010
simurai, a designer and front-end developer who writes about CSS and SVG experiments, icons, and small interface projects.
What HN saysHN commenters praise his CSS hacks and lab projects, and link his posts on SVG stacks, icon sharpness, Cursor Monster, and Letter-heads.
25HN people shared it
9linked it in comments
16stories submitted
241story points
2 years agolast shared
2010people per year2026
Most-shared posts
- 1We're in an icon-sharpness limbo3 people · 41 points · first shared 2012 · 22 comments on HN
- 2SVG Stacks3 people · 3 points · first shared 2012 · discussion on HN
- 3Cursor monster2 people · first shared 2017
- 4Letter-heads1 people · 118 points · first shared 2014 · 17 comments on HN
- 5Flick based scrolling in javascript1 people · 45 points · first shared 2012 · 8 comments on HN
- 6Flash haters, wake up (HTML5 ads demo)1 people · 17 points · first shared 2010 · 10 comments on HN
- 7Brushed Metal style in CSS31 people · 4 points · first shared 2011 · discussion on HN
- 8Sweet CSS3 Buttons1 people · 2 points · first shared 2018 · discussion on HN
- 9Animated CSS Mask icons1 people · 2 points · first shared 2012 · discussion on HN
- 10Media Query splitting1 people · 2 points · first shared 2012 · discussion on HN
- 11Contextual styling with custom properties1 people · 1 points · first shared 2018 · discussion on HN
- 12Nesting Components1 people · 1 points · first shared 2015 · discussion on HN
- 13Using CSS3 3D perspective, animation and reflection to render DVD cases1 people · 1 points · first shared 2010 · 1 comments on HN
- 14Short talk how CSS Flexbox will help create "flexible" web apps1 people · 1 points · first shared 2012 · discussion on HN
- 15Back to the :roots1 people · 1 points · first shared 2015 · discussion on HN
What HN people wrote when they linked it
ya3r · 2011-10-04
I really like this guy.
He has all sort of great CSS related hacks on his site http://simurai.com/tagged/lab
aruggirello · 2024-06-04
Why, just patch the page to add the famous Cursor Monster! https://simurai.com/projects/cursor-monster/
j4_james · 2016-10-25
Minor bug report: I was testing a page that was using SVG Stacks[1], where multiple icons are encapsulated in a single SVG image and the individual icons are referenced via fragment identifiers. This caused the WebBS calculator to count the SVG image multiple times (once for each fragment reference), resulting in a score that was significantly worse than it should have been.
[1] http://simurai.com/blog/2012/04/02/svg-stacks
bhauer · 2014-01-25
The creator [1] says it's inspired by Kumi Yamashita.
[1] http://simurai.com/projects/2011/03/11/letter-heads/
giovannibajo1 · 2013-09-02
SVG has a "shape-rendering:crispEdges" option that you can use to snap lines to pixels. See this blog post for more details:
http://simurai.com/post/19895985870/icon-sharpness-limbo
rimantas · 2012-10-17
Check out this: http://simurai.com/post/20251013889/svg-stacks
nathos · 2012-07-16
Vector graphics are not a panacea:
http://simurai.com/post/19895985870/icon-sharpness-limbo
http://www.pushing-pixels.org/2011/11/04/about-those-vector-icons.html
ecaron · 2012-04-27
The comments in this post really demonstrate the widespread pain points that everyone has when dealing with CSS sprites, and the existence of 30+ solutions indicates that nobody has really figured out how to fix it yet.
The lack of attention to SVG stacks (http://simurai.com/post/20251013889/svg-stacks) is very curious to me - being a proponent of this method/movement seems analogous to being pro-PNG in the era of GIFs.
bangonkeyboard · 2017-11-06