{"slug": "show-hn-illos-dev-animated-illustrations-and-skills-to-make-more-like-them", "title": "Show HN: Illos.dev, animated illustrations and skills to make more like them", "summary": "Illos.dev launched as a library of animated spot illustrations for product sites, with free spots and a $49 Pro tier that adds larger sections and page heroes plus \"skills\" that teach coding agents such as Claude Code, Cursor and Codex a theme's rules so new illustrations match the library. A $249 one-time team tier covers up to 10 people, and illustrations are delivered as React components via `npx shadcn@latest add` or as plain SVG. The product targets the inconsistency of agent-generated illustrations, which the site says produce \"a different hand\" on each request.", "body_md": "## Free\n\nFor trying Illos on a real page.\n\n$0forever\n- Every spot illustration, in every theme\n- React component or plain SVG\n- New spots as themes grow\n\n[Browse free illustrations](https://illos.dev/library/free)\n\nAnimated illustrations for your product site, and skills that teach any coding agent to make new ones in the same style.\n\nSponsored by[Tracwell](https://tracwell.app/?utm_source=illos&utm_medium=referral&utm_campaign=sponsorship&utm_content=landing_hero)\n\nAsk Claude, Cursor or any other coding agent for an illustration and you get a good one. Ask again tomorrow and you get a different hand. Illustrations used to be made one at a time in Figma, then animated in Jitter or Rive. Agents make them in seconds, but nothing teaches them your style.\n\nYouDraw an Isometric spot for our webhooks page. Just draw it.\n\nI drew the webhook spot as an isometric machine.\n\nI picked the concept myself, since you said to just draw it.\n\nA sender with a button stands at the end of a rail that runs into a receiver.\n\nThe button presses. The payload slides down the rail into the receiver's slot. The receiver's light flashes and a new payload fades in at the sender.\n\nI looked at the contact sheet. The machine reads at 240 px, the frames either side of the seam match, and the reduced-motion frame matches the start.\n\nThe checker ends with \"all checks passed\" and no warnings.\n\nI didn't do the hand-over step (the React component or inline snippet).\n\nEach one explains one idea and plays as it comes into view. The small ones, spots, are free.\n\n```\n$ npx shadcn@latest add\n  https://illos.dev/r/line-iso/queue.json\n```\nAdded components/illos/queue.tsx\n\n```\n// then, in any page\nimport { IllosQueue } from \"@/components/illos/queue\";\n<IllosQueue />\n```\nThis adds the illustration to your project as a React component. Or press Copy on its page for the SVG.\n\nYouDraw a spot for our webhooks page.\n\nThe skills teach any coding agent a theme's rules, so the illustrations it makes for your product match the library. Claude Code, Cursor, Codex and the rest. Comes with Pro.\n\nFor a whole product site, and an agent that makes more in your style.\n\n$49\nFor a team that ships product pages together, up to 10 people.\n\n$249one payment\nThe smallest size: one idea, about card size. Spots are free. Sections and page heroes are larger and come with Pro.\n\nNo. Open one, press Copy or Download, and it is yours to use.\n\nNo. Pro covers every theme in the library, including the ones released during your update year.\n\nYou keep everything you have and can keep using it. Renewing adds another year of new illustrations and toolkit updates.\n\nAny coding agent that can read files and run commands. Claude Code reads the skills directly, Cursor gets a rule for each one, and Codex, Windsurf and the rest follow the same files.\n\nNo: every sale is final, because Pro gives you the files and the skills straight away. Try the free spots first, they need no account. If you were charged twice or your licence never arrived, write to hello@illos.dev and we will put it right.\n\nBy card, through Dodo Payments. Get all access opens a secure checkout, and your license arrives at the email you pay with.\n\nSee who visits your site and what brings them back, with visitor insights from **Tracwell**\n\nLooking for a good UI library? Polished React components and blocks from **beUI**\n\nWant your product here? [Become a sponsor](https://illos.dev/sponsors)", "url": "https://wpnews.pro/news/show-hn-illos-dev-animated-illustrations-and-skills-to-make-more-like-them", "canonical_source": "https://illos.dev", "published_at": "2026-10-19 12:58:13+00:00", "updated_at": "2026-10-19 13:17:04.598782+00:00", "lang": "en", "topics": ["ai-agents", "ai-tools", "developer-tools", "generative-ai"], "entities": ["Illos.dev", "Claude Code", "Cursor", "Codex", "Windsurf", "Figma", "Jitter", "Rive"], "also_reported_by": [], "alternates": {"html": "https://wpnews.pro/news/show-hn-illos-dev-animated-illustrations-and-skills-to-make-more-like-them", "markdown": "https://wpnews.pro/news/show-hn-illos-dev-animated-illustrations-and-skills-to-make-more-like-them.md", "text": "https://wpnews.pro/news/show-hn-illos-dev-animated-illustrations-and-skills-to-make-more-like-them.txt", "jsonld": "https://wpnews.pro/news/show-hn-illos-dev-animated-illustrations-and-skills-to-make-more-like-them.jsonld"}}