A small tool to view real-world ActivityPub objects as JSON! Enter a URL
or username from Mastodon or a similar service below, and we'll send a
request with
the right
Accept
header
to the server to view the underlying object.
{
"@context": [
"https://www.w3.org/ns/activitystreams",
{
"ostatus": "http://ostatus.org#",
"atomUri": "ostatus:atomUri",
"inReplyToAtomUri": "ostatus:inReplyToAtomUri",
"conversation": "ostatus:conversation",
"sensitive": "as:sensitive",
"toot": "http://joinmastodon.org/ns#",
"votersCount": "toot:votersCount",
"blurhash": "toot:blurhash",
"focalPoint": {
"@container": "@list",
"@id": "toot:focalPoint"
},
"Hashtag": "as:Hashtag"
}
],
"id": "https://mastodon.social/users/anatudor/statuses/114413999066444872",
"type": "Note",
"summary": null,
"inReplyTo": null,
"published": "2025-04-28T05:44:37Z",
"url": "https://mastodon.social/@anatudor/114413999066444872",
"attributedTo": "https://mastodon.social/users/anatudor",
"to": [
"https://www.w3.org/ns/activitystreams#Public"
],
"cc": [
"https://mastodon.social/users/anatudor/followers"
],
"sensitive": false,
"atomUri": "https://mastodon.social/users/anatudor/statuses/114413999066444872",
"inReplyToAtomUri": null,
"conversation": "tag:mastodon.social,2025-04-28:objectId=983201942:objectType=Conversation",
"content": "<p>Maybe don't rely on AI to answer your CSS questions. Actually... without the maybe. Don't rely on AI to answer your CSS questions.</p><p><a href=\"https://mastodon.social/tags/CSS\" class=\"mention hashtag\" rel=\"tag\">#<span>CSS</span></a> <a href=\"https://mastodon.social/tags/AI\" class=\"mention hashtag\" rel=\"tag\">#<span>AI</span></a> <a href=\"https://mastodon.social/tags/aiCode\" class=\"mention hashtag\" rel=\"tag\">#<span>aiCode</span></a> <a href=\"https://mastodon.social/tags/code\" class=\"mention hashtag\" rel=\"tag\">#<span>code</span></a> <a href=\"https://mastodon.social/tags/coding\" class=\"mention hashtag\" rel=\"tag\">#<span>coding</span></a> <a href=\"https://mastodon.social/tags/frontend\" class=\"mention hashtag\" rel=\"tag\">#<span>frontend</span></a> <a href=\"https://mastodon.social/tags/web\" class=\"mention hashtag\" rel=\"tag\">#<span>web</span></a> <a href=\"https://mastodon.social/tags/dev\" class=\"mention hashtag\" rel=\"tag\">#<span>dev</span></a> <a href=\"https://mastodon.social/tags/webDev\" class=\"mention hashtag\" rel=\"tag\">#<span>webDev</span></a> <a href=\"https://mastodon.social/tags/webDevelopment\" class=\"mention hashtag\" rel=\"tag\">#<span>webDevelopment</span></a> <a href=\"https://mastodon.social/tags/cssGradient\" class=\"mention hashtag\" rel=\"tag\">#<span>cssGradient</span></a></p>",
"contentMap": {
"en": "<p>Maybe don't rely on AI to answer your CSS questions. Actually... without the maybe. Don't rely on AI to answer your CSS questions.</p><p><a href=\"https://mastodon.social/tags/CSS\" class=\"mention hashtag\" rel=\"tag\">#<span>CSS</span></a> <a href=\"https://mastodon.social/tags/AI\" class=\"mention hashtag\" rel=\"tag\">#<span>AI</span></a> <a href=\"https://mastodon.social/tags/aiCode\" class=\"mention hashtag\" rel=\"tag\">#<span>aiCode</span></a> <a href=\"https://mastodon.social/tags/code\" class=\"mention hashtag\" rel=\"tag\">#<span>code</span></a> <a href=\"https://mastodon.social/tags/coding\" class=\"mention hashtag\" rel=\"tag\">#<span>coding</span></a> <a href=\"https://mastodon.social/tags/frontend\" class=\"mention hashtag\" rel=\"tag\">#<span>frontend</span></a> <a href=\"https://mastodon.social/tags/web\" class=\"mention hashtag\" rel=\"tag\">#<span>web</span></a> <a href=\"https://mastodon.social/tags/dev\" class=\"mention hashtag\" rel=\"tag\">#<span>dev</span></a> <a href=\"https://mastodon.social/tags/webDev\" class=\"mention hashtag\" rel=\"tag\">#<span>webDev</span></a> <a href=\"https://mastodon.social/tags/webDevelopment\" class=\"mention hashtag\" rel=\"tag\">#<span>webDevelopment</span></a> <a href=\"https://mastodon.social/tags/cssGradient\" class=\"mention hashtag\" rel=\"tag\">#<span>cssGradient</span></a></p>"
},
"updated": "2025-04-28T07:43:05Z",
"attachment": [
{
"type": "Document",
"mediaType": "image/png",
"url": "https://files.mastodon.social/media_attachments/files/114/413/992/737/708/745/original/91f2494eb3f263eb.png",
"name": "Prompt: gradient triangle CSS\n\nAnswer:\nAh, a gradient triangle with CSS! That's a fun little visual trick. There are a few ways to achieve this, playing with borders and linear gradients. Here's a common and effective method using linear-gradient on a pseudo-element:\n\nCSS\n```\n.gradient-triangle {\n width: 0;\n height: 0;\n border-left: 50px solid transparent; /* Adjust size as needed */\n border-right: 50px solid transparent; /* Adjust size as needed */\n border-bottom: 100px solid red; /* Initial solid color */\n position: relative; /* For positioning the pseudo-element */\n}\n\n.gradient-triangle::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: -50px; /* Match the left border */\n width: 100px; /* Match the combined left and right borders */\n height: 100px; /* Match the bottom border */\n background: linear-gradient(to bottom, rgba(255, 0, 0, 0), blue); /* Gradient */\n -webkit-mask: polygon(0 0, 100% 0, 50% 100%); /* Clip to a triangle */\n mask: polygon(0 0, 100% 0, 50% 100%);\n}\n```",
"blurhash": "U05OTx^,o#S4NFD%%2n%RND%kWRjozMxxajY",
"focalPoint": [
0,
0
],
"width": 725,
"height": 729
}
],
"tag": [
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/css",
"name": "#css"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/ai",
"name": "#ai"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/aicode",
"name": "#aicode"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/code",
"name": "#code"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/coding",
"name": "#coding"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/frontend",
"name": "#frontend"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/web",
"name": "#web"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/dev",
"name": "#dev"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/webdev",
"name": "#webdev"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/webdevelopment",
"name": "#webdevelopment"
},
{
"type": "Hashtag",
"href": "https://mastodon.social/tags/cssgradient",
"name": "#cssgradient"
}
],
"replies": {
"id": "https://mastodon.social/users/anatudor/statuses/114413999066444872/replies",
"type": "Collection",
"first": {
"type": "CollectionPage",
"next": "https://mastodon.social/users/anatudor/statuses/114413999066444872/replies?only_other_accounts=true&page=true",
"partOf": "https://mastodon.social/users/anatudor/statuses/114413999066444872/replies",
"items": []
}
},
"likes": {
"id": "https://mastodon.social/users/anatudor/statuses/114413999066444872/likes",
"type": "Collection",
"totalItems": 9
},
"shares": {
"id": "https://mastodon.social/users/anatudor/statuses/114413999066444872/shares",
"type": "Collection",
"totalItems": 5
}
}