December 30th: Stone, Shadow, and Sun
Keyboard - Type Something
Type something on your keyboard and watch the keys on Ricardo Oliva Alonso's keyboard move and type along with you.Sponsored:
WooCommerce is a flexible and powerful eCommerce open-source plugin for WordPress. There are 450+ plugins for it, enabling things like booking appointments, memberships, subscriptions, and tons more.
We wrapped up the last #CodePenChallenge of 2019 with some holiday trees! Check out the trees crafted from ordered and unordered lists, including Gabriele Corti's "DTree".
Password Input Light
"Let the light reveal your password! A silly experiment using a show/hide toggle on a password input" from Ryan Mulligan.
CSS Infinity Stone
These Sass-y infinity stones from Harold Winston are so pretty you can almost forget just how powerful they are!
Layered text-shadow Effect CSS
"text-shadow is a fun little CSS style that can spark up any simple text into a beautiful work of art" from ShireeenTaj.Sponsored:
You Should Probably Learn React
Snowflake Audio Visualizer
The Keyframers' wintry scene reacts to your audio with snowflakes! Check out the tutorial link (beneath the snow) to see a video of how it was made.
Rafael Castro Couto pays tribute to a developer's powerful ally in this Star Wars-inspired Pen.
Solar Eclipse CSS Only
This stunning solar eclipse with realistic clouds is a little tough on the browser, but a lot easier on your eyes than the real thing. From Dave Quah.
"A present opening sequence where the wrapping and ribbon explode into pieces. Click the present or press Space to open!" from Jon Kantner.
3D CSS Transform Rotation Builder
Learn the basics of CSS 3D transforms from this interactive demo by Burton Media.
Pure CSS Circular Border Patterns
Ana Tudor's single-element badge designs are inspired by a neon sign at the Scandic Grand Central hotel in Stockholm.
CSS Goey Footer
"I'm a little late to the blob party, but I'm having fun". A playful footer with strong "the floor is lava" vibes from Zed Dash.