I’ve been experimenting on different ways to make e-cards using CSS3. I found a way to make a 3D cube that can be moved by using the arrow keys on the keyboard. Here are some screenshots of what I’ve created… a birthday “greeting card” using my monster illustrations.
For the second card I created, I changed the letters using and manipulating the script Lettering.js. The letters each had a container and a span with different properties. I was able to set how the letters are in their regular state, and then transition, and transform states using skew properties, shadow properties, and color/font style properties. The speech bubble is an additional “CSS3 Trick” created with border properties to make the large curve of the bubble, the smaller curve of the bubble, the shape at the bottom where the two sides meet, and the white inside part of the bubble. There are standard properties like position, margin, color, etc. but there are more complex properties like z-index, position, and radius properties.