I turn 12 on CodePen tomorrow, so after my most hearted demos ...

2024-06-24 18:08:20

I turn 12 on CodePen (npub1sf7…gl68) tomorrow, so after my most hearted demos https://mastodon.social/@anatudor/112511958366259967

... here are 12 of MY personal faves!

1⃣ Pure CSS music toy - this one's a really special one for me https://codepen.io/thebabydino/pen/WNGPjLx

CSS transforms for the 3D, CSS variables for the dynamic shading.

The how behind:

⭐ metallic https://www.youtube.com/watch?v=_CV364uqP3U

⭐ wooden https://www.youtube.com/watch?v=RQX4BBjApeE

#3D #CodePen #geometry #maths #CSS #noJS #transform #code #coding #web #webDev #dev #frontend #webDevelopment

Author Public Key

npub1ahnq52t7xsmfypa3t8c4fpprz5m2e5sg4zfsf7lfc9n2n3j5qs6sskkqax

Show more details

Published at

2024-06-24 18:08:20

Kind type

1 Short Text Note

Event JSON

{ "id": "69050626e6e97953e6f4e67eff696d095f003b35a669be8982e3a5150b0a7d14", "pubkey": "ede60a297e34369207b159f15484231536acd208a89304fbe9c166a9c6540435", "created_at": 1719252500, "kind": 1, "tags": [ [ "t", "code" ], [ "imeta", "url https://files.mastodon.social/media_attachments/files/112/672/911/544/622/790/original/063d959f6beb9cb9.mp4", "m video/mp4" ], [ "t", "webdev" ], [ "t", "web" ], [ "t", "frontend" ], [ "t", "maths" ], [ "t", "geometry" ], [ "t", "dev" ], [ "t", "transform" ], [ "t", "webdevelopment" ], [ "t", "coding" ], [ "t", "nojs" ], [ "t", "codepen" ], [ "p", "827dff3631108ba3a2eb2c455615166c4320e10ce086f31afa6aa657a94ca1db" ], [ "t", "css" ], [ "proxy", "https://mastodon.social/@anatudor/112672931884308203", "web" ], [ "t", "3d" ], [ "proxy", "https://mastodon.social/users/anatudor/statuses/112672931884308203", "activitypub" ], [ "L", "pink.momostr" ], [ "l", "pink.momostr.activitypub:https://mastodon.social/users/anatudor/statuses/112672931884308203", "pink.momostr" ], [ "expiration", "1722015173" ] ], "content": "I turn 12 on nostr:npub1sf7l7d33zz968ght93z4v9gkd3pjpcgvuzr0xxh6d2n9022v58ds48gl68 tomorrow, so after my most hearted demos https://mastodon.social/@anatudor/112511958366259967\n\n... here are 12 of MY personal faves!\n\n1⃣ Pure CSS music toy - this one's a really special one for me https://codepen.io/thebabydino/pen/WNGPjLx\n\nCSS transforms for the 3D, CSS variables for the dynamic shading.\n\nThe how behind:\n\n⭐ metallic https://www.youtube.com/watch?v=_CV364uqP3U\n\n⭐ wooden https://www.youtube.com/watch?v=RQX4BBjApeE\n\n#3D #CodePen #geometry #maths #CSS #noJS #transform #code #coding #web #webDev #dev #frontend #webDevelopment\nhttps://files.mastodon.social/media_attachments/files/112/672/911/544/622/790/original/063d959f6beb9cb9.mp4\n", "sig": "fa8b9ad7b8c1ebce97883aac059658523560a630e07ba6054b0b12b2eca1feb9d11c07df6ba23bffff037a679f0a4106430f1e7a224a98a2469deefdfaa5f6e2" }

Ana Tudor 🐯 on Nostr: I turn 12 on CodePen tomorrow, so after my most hearted demos ...