loading...

Discussion on: Pure CSS outlined triangle using only borders △△△△△△△

Collapse
devmount profile image
Andreas

A very creative approach. Nevertheless I would recommend using an SVG here as it is widely supported today, scalable, customizable and much cleaner and lighter. You needed ~40 lines of code and >900 Byte. You could achieve the same result with SVG in 3 lines and 136 Bytes:

<svg height="200" width="300">
  <polygon points="150,30 250,150 50,150" style="fill:transparent;stroke:white;stroke-width:30" />
</svg>

Collapse
astrit profile image
Astrit Author

It is 100% true, however the idea behind css.gg is that all icons are made entirely on CSS perhaps not the best solution.
Also it can be compressed also with the rest of the style and minimal markup.

Collapse
devmount profile image
Andreas

the idea behind css.gg is that all icons are made entirely on CSS

What are the reasons/advantages for which you choose this approach?
Don't get me wrong: building 500+ Icons in CSS is impressive! But in my opinion using SVG is much more performant and usable...

Thread Thread
astrit profile image
Astrit Author

The idea was that you could compile the icons with the rest of style and less things to maintain, cleaner markup since all the major browsers support the features used on the icons, if you like to know more please read this article where I did explain everything.