Ana Tudor 🐯 on Nostr: #cssChallenge2023 How would you code this sort of outset gradient border with: ❌no ...
#cssChallenge2023
How would you code this sort of outset gradient border with:
❌no JS
⚠️only 1 img element
❌no magic values for the gradient stops, they're obtained from img source
⚠️no SVG, no images in general other than the actual image & the border one
#css #frontend #webDev #webDevelopment #coding #code
Image examples 👇
Published at
2023-04-29 16:26:40Event JSON
{
"id": "16f4379deecce37d4397c92a0c094f622acbbe65bf00a0edd2f86531407f777d",
"pubkey": "708789c2b324d71ee51c3818622526e1eda1f6ebd9a9ffeba1f09554be3a2562",
"created_at": 1682785600,
"kind": 1,
"tags": [
[
"t",
"csschallenge2023"
],
[
"t",
"css"
],
[
"t",
"frontend"
],
[
"t",
"webdev"
],
[
"t",
"webdevelopment"
],
[
"t",
"coding"
],
[
"t",
"code"
],
[
"mostr",
"https://mastodon.social/users/anatudor/statuses/110283037126411114"
]
],
"content": "#cssChallenge2023\n\nHow would you code this sort of outset gradient border with:\n\n❌no JS\n⚠️only 1 img element\n❌no magic values for the gradient stops, they're obtained from img source\n⚠️no SVG, no images in general other than the actual image \u0026 the border one\n\n#css #frontend #webDev #webDevelopment #coding #code \n\nImage examples 👇\n\nhttps://files.mastodon.social/media_attachments/files/110/283/030/657/604/804/original/d3e0ebf8d8dc17eb.png\n\nhttps://files.mastodon.social/media_attachments/files/110/283/031/180/627/008/original/dd92c97942e845e2.png\n\nhttps://files.mastodon.social/media_attachments/files/110/283/031/771/265/313/original/700bebf2a02d05a4.png\n\nhttps://files.mastodon.social/media_attachments/files/110/283/032/499/067/324/original/0c2f3c837f071c8c.png",
"sig": "8a4da58bd0d9c219f14007ce6d072a2ffe7e1790d10529d9661dc9749fe036caafc925d79d09bff9b7e9bef72974bd2d8f442e5e21dcda943ba071ac15b4ac33"
}