With CSS3’s 3D transforms it is possible to create a sphere-like object, albeit with many elements. Recently I’ve been looking at creating applicable 3D carousels. These rely on positioning panels in a circle around a central point (ie. rotation about the Y-axis), I put these panels in an unordered list. A natural extension is to duplicate each
<ul> and rotate about the X-axis, creating a sphere.
A triangle can be created in CSS by manipulating the borders of an element. Combining four triangles in a 3D space using
-webkit-transform, these can be positioned to form a tetrahedron (or pyramid if you prefer). With CSS animations this can also spin.
An update to the original 3D cube (from July 2009), I’ve added touch gesture support (iOS) and click-and-drag behaviour. Animation is incredibly smooth on the iPhone, even the 3G model. Arrow key presses will still rotate the cube, and ESC will reset it.
-webkit-perspective and a number of updated transforms–adapted to incorporate the Z axis.