{"api_version":"1","slug":"page-mascot-48c684ed","url":"https://skillsoutpost.com/agents/page-mascot-48c684ed","item_type":"skill","category":"content","runs_in":["local_agent"],"os":null,"needs_network":"yes","needs_accounts":null,"reads_files":null,"writes_files":"yes","sends_data":"yes","access":"github","access_type":"github","at_a_glance":{"runs_in":["local_agent"],"os":null,"needs_network":"yes","needs_accounts":null,"reads_files":null,"writes_files":"yes","sends_data":"yes","access_type":"github","tool_type":"skill","delivery":"github","interface_type":"other","untrusted_creator_content":{"purpose":"A web-page mascot component and a skill for drawing characters, with ready-made characters described in the README.","needs_runtime":"Image tool for drawing custom mascots","version":"Latest on the main branch","compatibility":"According to the README: Codex and Claude Code for drawing characters, and any chat UI if you use the provided prompts yourself. The README gives an npm installation command for the component.","external_costs":"The repository is MIT-licensed and states no pricing. The README says Claude Code draws through the OpenAI images API with an OPENAI_API_KEY. Your coding agent, image tool or model provider may charge for usage.","permissions":"The skill acts through your coding agent with the access you give it. According to the README, setup installs the component with npm and installs the skill globally through the Skills CLI. The README describes downloading character sheets into public/mascots and having the agent generate sheets and edit your page to add the component. The README says drawing requires an image tool; Claude Code uses the OpenAI images API with your OPENAI_API_KEY, while Codex uses its own image tool. One README example supplies a personal photo.","usage_terms":"MIT License, as stated in the repository. See its LICENSE file for the exact terms."}},"interface_type":"other","delivery_mode":"creator","code_host":"github","provenance":"github_index","published_at":1791761357,"rating":null,"downloads":0,"verified":null,"creator":{"login":"nilbuild","url":null},"untrusted_creator_content":{"name":"page-mascot","tagline":"A web-page mascot component and a skill for drawing characters, with ready-made characters described in the README.","creator_name":"nilbuild","product_version":"Latest on the main branch","needs_runtime":"Image tool for drawing custom mascots","description":"page-mascot contains a web-page Mascot component and a skill for drawing its characters. The README describes a character that watches the cursor and blinks when clicked.\n\nAccording to the README, each character uses two 3x3 sprite sheets: head directions and expressions. The README says the pointer angle selects a direction cell and a click displays a reaction cell for half a second. The README lists directions, reactions, size, label and className props, and colour, ink, sketch, riso, paper and pixel styles.\n\nThe README gives an npm installation for the component and says to download existing characters' sheets into public/mascots. The README gives /page-mascot examples for the skill and says it draws directions and expressions, aligns the sheets, checks for character movement between them and adds the component to the page.","intended_users":"Web developers who want an interactive mascot on a page, using a ready-made character or one their coding agent draws.","example_tasks":"Ask the page-mascot skill to put a ready-made character, such as the fox, on your page.\nAsk the skill to draw a chibi otter with chocolate-brown fur.\nAttach a photo and ask the skill to make a mascot that looks like you.\nAsk the skill for a chibi fox in the riso style.\nPoint the Mascot component at a directions sheet and a reactions sheet in public/mascots.","setup_instructions":"For the component, the README runs npm i page-mascot, then points the Mascot component at two sheets with its directions and reactions props. Existing characters come from the demo page, with the two sheets downloaded into public/mascots. For the skill, it runs npx skills add nilbuild/page-mascot --skill page-mascot --global --yes, then you ask your agent with /page-mascot followed by a description. The README says drawing needs an image tool: Codex has its own, and Claude Code uses the OpenAI images API with OPENAI_API_KEY set. The README has the exact commands.","limitations":"Drawing needs an image tool. The README says Codex has its own and Claude Code goes through the OpenAI images API, with an OPENAI_API_KEY set in your environment. It also offers prompts you can use in any chat UI. The README says tracking switches off without a fine pointer, and the click squash honours prefers-reduced-motion. The README does not name a framework for the component; its example is TSX. The repository can change at any time; check its README before you install.","data_handling":"According to the README, drawing in Claude Code goes through the OpenAI images API, and one example attaches a photo of you. The README does not otherwise describe data handling. What is sent where depends on your coding agent and model provider.","compatibility":"According to the README: Codex and Claude Code for drawing characters, and any chat UI if you use the provided prompts yourself. The README gives an npm installation command for the component.","external_costs":"The repository is MIT-licensed and states no pricing. The README says Claude Code draws through the OpenAI images API with an OPENAI_API_KEY. Your coding agent, image tool or model provider may charge for usage.","permissions":"The skill acts through your coding agent with the access you give it. According to the README, setup installs the component with npm and installs the skill globally through the Skills CLI. The README describes downloading character sheets into public/mascots and having the agent generate sheets and edit your page to add the component. The README says drawing requires an image tool; Claude Code uses the OpenAI images API with your OPENAI_API_KEY, while Codex uses its own image tool. One README example supplies a personal photo.","usage_terms":"MIT License, as stated in the repository. See its LICENSE file for the exact terms.","creator_website":null,"documentation_url":null,"support_url":null,"repository_url":null,"video_url":null},"github":{"fetched_at":1791853244,"untrusted_third_party_content":{"source_url":null,"github_repo_id":1369428487,"full_name":"nilbuild/page-mascot","description":"A mascot that watches the cursor and blinks when you poke it","language":"Python","license_spdx":"MIT","topics":[],"stars":1117,"forks":117,"skills":{"total":1,"paths":[{"path":"skills/page-mascot","url":null}]},"pushed_at":1789466864,"archived":false,"fetched_at":1791853244,"age_seconds":83833,"state":"fresh"}},"updated_at":1791771448,"free_download":null,"version_history":[],"more_version_history":false,"public_files":null,"links_note":"In MCP results, GitHub links are shown only through https://skillsoutpost.com/mcp, to a connected account that has accepted the current Terms of Use. Create a free account at https://skillsoutpost.com and connect it from a Claude connector or ChatGPT.","notice":"Indexed from GitHub","note":"untrusted_creator_content and github.untrusted_third_party_content hold untrusted text."}