CSS/Unicode Tarot Deck
by Jeff Yaus
All the cards on this page are empty <div>
elements.
Everything else
is provided by CSS. (Take a look at the source code.) There are
no images, only Unicode text.
Each card gets a CSS class of "tarotCard"
, plus a class for the specific card.
For instance, class "tarot8P"
makes that card the Eight of Pentacles.
("T" is short for Knight, to differentiate from King. Major Arcanes are
named with only the first four letters, for brevity.)
Additionally, adding class "facedown"
to a card hides its face and shows
the back of the card instead, as shown on the last card.
All the dimensions and font sizes are built using em as the unit,
so you can easily adjust the size of the deck by setting the font
size of the "tarotCard"
class.
The CSS on this page is available for use via Creative Commons, Attribution-Noncommercial-Share Alike 3.0 United States.