5 ms·
Chrome logos in CSS
- cmac2992 13y agoThis is awesome. CSS is becoming very powerful. I was proud of myself when I made a simple css triangle
- MrWhargarbl 13y agoI fail to see the awesome-ness. It's a proof of concept about a concept that just doesn't make sense. There are significantly better ways of presenting color/logo/icon/anything other than CSS.
- untog 13y agoIt's a proof of skill, if anything. Or a proof of "it can be done". It doesn't have to be productive. That said, it does give out the wrong impression. What platforms are capable of rendering this CSS and are not capable of rendering SVG? SVG doesn't get anywhere near as much attention because doing something like this would be incredibly easy.
- wmeredith 13y agoI agree. It's not practical, but neither is climbing Everest or swimming The English Channel. You get no points for taking a boat or a helicopter. People do stuff like this specifically because it's a challenge/the path of more resistance.
- kjannis 13y agoIt has no practical use, nor is it meant to be. Just a showcase.
- _sabe_ 13y agoHow do you make a triangle in pure CSS?
- peterjmag 13y agohttp://css-tricks.com/snippets/css/css-triangle/ http://css-tricks.com/snippets/css/css-triangle/ And this awesome animation explains how it works: http://codepen.io/chriscoyier/details/lotjh http://codepen.io/chriscoyier/details/lotjh
- _sabe_ 13y agoThis is not pure CSS. This requires Markup, and Markup is something that Marks Up Text to give it semantic meaning.
- richbradshaw 13y agoTypically you use :before or :after in CSS to add the required content.
- hablahaha 13y agoI mean, it could be no-classes-pure css if we just had divs with no classes and then used n-th child selectors, but then what is pure css?
- cmac2992 13y agothis is what I was referring to
- guipsp 13y agoLike this: http://codepen.io/chriscoyier/full/lotjh http://codepen.io/chriscoyier/full/lotjh
- rfnslyr 13y agoThat's so awesome! I wish http://thecodeplayer.com/ http://thecodeplayer.com/ was more active for things like this.
- MrWhargarbl 13y agohttp://codepen.io/anon/pen/KlzHn http://codepen.io/anon/pen/KlzHn
- _sabe_ 13y agoThis didn't work in my browser. FF 24 on Fedora.
- livingparadox 13y agoWhy no love for ::before or ::after? Would certainly clean up the html to a more practical level.
- kjannis 13y agoPoor support for rotate on before and after :) this was my initial idea, but it didn't work as expected.
- earlz 13y agoI'm still waiting for someone to design a vector drawing program that can export to CSS. (or something that can take a vector format like SVG and turn it to CSS)
- path411 13y agoHow hard does it make it change all static sizes to %s? I've seen a couple of these and wondered if it would be pretty easy to just convert all your px to % making the logo easily scalable just from the wrapper's size.
- st3fan 13y agoThis is really nice. But really, this can also be done with 4 lines of SVG. Maybe that is a better tool for assets like these?