7 ms·
Helveticards - 100% CSS playing cards
- skrebbel 14y agoThis looks impressive, until you realise that the jack, clubs, spades and diamonds are simply unicode glyphs present in many system fonts.
- Gurrewe 14y agoThis would actually be cool if the characters where made out of CSS-styling too. Now, it's not.
- tjohns 14y agoAt first, I thought this was a repost of the "Helveticards" physical card deck that was released a while ago. It's not, but worth a look if 're a typography fan (or just like good design): http://helveticards.ryanmyers.me/ http://helveticards.ryanmyers.me/
- ChrisNorstrom 14y agoYeah, Ryan (uberryan) the creator of those cards is kind of pissed about the OP using the same name. As you can tell from the comments below, he's doing some kind of weird passive-aggressive attack on the OP. And I'm eating popcorn & watching how the whole thing unfolds. Knowing HN's stance on ideas/IP/Patents I don't think HN is going to side with Ryan.
- icebraining 14y agoI don't think you can assert the stance on names from a stance on copyright or patents; they're very different issues. Trademarks can be abused, but they're much less problematic and create a direct, tangible benefit to the consumer (not getting defrauded by fakes).
- aidenn0 14y agoThat is an example of terrible design, combining the two biggest no-nos in playing card design: Full Bleed and Asymmetric backs.
- deleted 14y ago[deleted]
- uberryan 14y agoUnfortunately, this is in licensing infringement with the actual Helveticards (helveticards.ryanmyers.me). I have contacted the creator and informed him of the conflict.
- julien_c 14y agoLicensing infringement over what? A possible Helveticards trademark? (The designs don't look similar at all)
- julien_c 14y agoAt least in the US, there is no trademark over name Helveticards (http://www.uspto.gov/trademarks/process/search/#heading-1 http://www.uspto.gov/trademarks/process/search/#heading-1)
- uberryan 14y agoTo use any version of the 'Helvetica' name in a product or object, LinoType must issue a license. I, myself, received a cease-and-desist from their legal team if I didn't acquire a licensing agreement, which I did. I didn't say I had a trademark. All that would do is disallow usage of the Helveticards mark that I designed.
- daleharvey 14y agoThat isnt a licensing agreement with helveticards, that is a possible licence issue with linotype
- antidaily 14y agoPerhaps but those look like shit.
- deleted 14y ago[deleted]
- Falling3 14y agoAw I was hoping for some intricate CSS version of the backs of the cards.
- tantalor 14y agoAnd the face cards. Where's my suicide king?
- ChrisNorstrom 14y ago:( Why didn't you use border-radius and box-shadow? They would look much more realistic if you did. EDIT: The rounded corners and box shadow aren't showing up in Firefox 15.0.1 for Windows 7 for me. Anyone else?
- valnour 14y agoWorks for me in Firefox 15.0.1 on Linux.
- akdetrick 14y agoThis looks like absolutely positioned bits of text with unicode glyphs inside divs with a box shadow and border radius. Am I missing something? Not that the execution or idea are bad, but I don't understand why this is on the front of HN today. With that said, I do think that the use of unicode characters is a much better move than using some crazy css tricks to draw the suit symbols.
- icebraining 14y agoShame they didn't implement a Baraja[1]; now there's a challenge! [1]: http://en.wikipedia.org/wiki/Baraja_(playing_cards) http://en.wikipedia.org/wiki/Baraja_(playing_cards)
- balac 14y agoThat would be awesome, I started making a chinchon game a while back and a baraja set in CSS would be awesome to have.
- zachwaugh 14y agoKind of surprised to find this on here today. I made it about two years ago as a quick hack, and haven't touched it since. I used unicode glyphs because I didn't see any benefit of recreating those in CSS. Was planning on adding the backsides so you could flip them over, but never got around to it.
- deleted 14y ago[deleted]
- rootedbox 14y agowell it's helvetica on a mac.. should pay for a license so it works on all platforms.. just sayin.
- tantalor 14y agoWhere's the license file?
- FlukeATX 14y agoHere: https://github.com/zachwaugh/Helveticards https://github.com/zachwaugh/Helveticards
- javajosh 14y agoI actually thought this was going to be a link to a card game that teaches people CSS! (Which is a pretty nifty idea, if I do say so myself!)
- ck2 14y agoI think this could be improved by not using any classes on the spans and instead in the stylesheet using nth element rules to define each card? It would reduce the html weight. Just plain spans or divs. I guess it would be a problem for older browsers http://caniuse.com/css-sel3 http://caniuse.com/css-sel3 darn IE always holding us back.
- wanghq 14y agoI only see 52 cards. Can you make the missing two?
- geon 14y agoMore like 50/50 html and css. All the symbols are text. ♣♦♠♥
- antihero 14y agoThis would be awesome if the Jack/King/Queen/Ace etc had some neat playing-card style face design done with CSS.