reminds me of this nice icon project, where icons are also designed with one css block:
cssicon.space
CSS Sans – A font created in CSS
41–50 of 52 posts
Re: CSS Sans – A font created in CSS
#42This would be incredible for some privacy applications if you wrote a wrapper on top of it to obfuscate the class names. Clearly visible to users, very difficult for bots to pick up without clearly looking for it.
While this may evade simple scraping bots, it's easy enough to render the page then use some type of character recognition to get the content.
It’s fairly trivial to quickly animate each letter or stroke to flicker at a random high speed interval so anytime a render captures a screenshot you get garbled incomprehensible text.
Re: CSS Sans – A font created in CSS
#43Earlier quoted context omitted.
You can use the font-size property as usual, if you convert the font definition from px units to em units. EDIT: Demo with font-size: https://jsfiddle.net/6cg8dLnz/
Baseline is broken with display: inline-block but works with float: left : https://jsfiddle.net/eywwmL2o/ Haven't figured out how to fix kerning if it's even supposed to work.
Like this: https://jsfiddle.net/95v642n6/
.font div {
display: inline-block;
vertical-align: top;
}
.H + .U { margin-left: 2px; }
.U + .G { margin-left: 1px; }
.G + .E { margin-left: -5px; }Re: CSS Sans – A font created in CSS
#44Earlier quoted context omitted.
That’s not "gray hat", that’s entirely black hat, utterly immoral, and purely malicious. And honestly, we as society should do anything to eliminate people doing this.
Well that went from 0-60 in no time. Society has much larger fish to fry. No one was harmed in this endeavor. Sure it "polluted the web" and was against Google's guidelines, but we definitely weren't hacking or doing other true "black hat" things. Ultimately it was shut down in 2012 and in the entire time I was involved in this 2 people requested their domain back and we sent it their way no questions asked. Content…
Great and interesting comments anyway.
As much I would call me a white hat, I guess most of us have done we're not proud of in the past.
I for one used to work a very short time at a small dating portal that used like any available way to get users to pay.
Re: CSS Sans – A font created in CSS
#45I am somehow disappointed that all the text on the website is not displayed using the font itself :p
That.
Re: CSS Sans – A font created in CSS
#46Awesome. I love that you have a section showing exactly what CSS properties are used to create each letter.
Hover over a letter's class to highlight the rendered stroke.
Re: CSS Sans – A font created in CSS
#47Probably useless for any applications, but this is really cool! The page with the definitions of all characters A–Z is here: https://yusugomori.com/projects/css-sans/fonts It's interactive, so you can actually see how the definition (CSS code) of each character corresponds to the actual shape seen. Something like this (but with different primitives, not CSS) is how Donald Knuth made the program Metafont, using which…
The novel bit here, for me, is how the 'C' 'G' and 'J' use 'knockouts' to remove 'ink', kinda like using a CSG (constructive solid geometry) subtraction.
Very clever.
Re: CSS Sans – A font created in CSS
#48Probably useless for any applications, but this is really cool! The page with the definitions of all characters A–Z is here: https://yusugomori.com/projects/css-sans/fonts It's interactive, so you can actually see how the definition (CSS code) of each character corresponds to the actual shape seen. Something like this (but with different primitives, not CSS) is how Donald Knuth made the program Metafont, using which…
To me, the most interesting part of Metafont is that it can take parameters. So your font could, for example, take a parameter for weight, letting you create as many different weight variants as you like. You can use one algorithm to create a Thin, Light, Regular, Medium, Demi, Bold, Black family of fonts. Or you could put a skew parameter in to generate an Oblique version (though true italics would require a separat…
There is a term for that "variable font". One type face come to mind, currently being developed, which should come out in september by famous Font Bureau. [1]
[1]: https://www.typenetwork.com/brochure/opentype-variable-fonts...
Re: CSS Sans – A font created in CSS
#49Earlier quoted context omitted.
That’s not "gray hat", that’s entirely black hat, utterly immoral, and purely malicious. And honestly, we as society should do anything to eliminate people doing this.
Well that went from 0-60 in no time. Society has much larger fish to fry. No one was harmed in this endeavor. Sure it "polluted the web" and was against Google's guidelines, but we definitely weren't hacking or doing other true "black hat" things. Ultimately it was shut down in 2012 and in the entire time I was involved in this 2 people requested their domain back and we sent it their way no questions asked. Content…
thanks for sharing this, it's good to know what's out there, hope you have found a vocation :)
Re: CSS Sans – A font created in CSS
#50[deleted]