{"slug": "github-code-web-component", "title": "github-code Web Component", "summary": "Simon Willison built an experimental Web Component called github-code using GPT-5.5 that embeds code from GitHub by fetching raw content and displaying a specified range of lines with line numbers but no syntax highlighting.", "body_md": "**Tool:** [github-code Web Component](https://tools.simonwillison.net/github-code-component)\n\nAn experimental Web Component built using GPT-5.5 and [the following prompt](https://gist.github.com/simonw/0e3db21947b5ae7e29e8a4f69a0b0617):\n\n`let's build a Web Component for embedding code from GitHub`\n\n`<github-code href=\"https://github.com/simonw/sqlite-ast/blob/437c759129154f05296324a7f82aa1246340dd14/sqlite_ast/parser.py#L9-L18\"></github-code>`\n\n`It takes URLs like that, converts them to https://raw.githubusercontent.com/simonw/sqlite-ast/437c759129154f05296324a7f82aa1246340dd14/sqlite_ast/parser.py, then uses fetch() to fetch them and displays the specified range of lines - with line numbers, no syntax highlighting though`\n\n`Show me a preview web browser so I can see your work`\n\nHere's what it looks like embedded on this page:\n\nTags: [github](https://simonwillison.net/tags/github), [web-components](https://simonwillison.net/tags/web-components), [gpt](https://simonwillison.net/tags/gpt)", "url": "https://wpnews.pro/news/github-code-web-component", "canonical_source": "https://simonwillison.net/2026/Jul/7/github-code-component/#atom-everything", "published_at": "2026-07-07 16:18:16+00:00", "updated_at": "2026-07-08 20:12:10.388424+00:00", "lang": "en", "topics": ["developer-tools", "generative-ai", "large-language-models"], "entities": ["Simon Willison", "GPT-5.5", "GitHub"], "alternates": {"html": "https://wpnews.pro/news/github-code-web-component", "markdown": "https://wpnews.pro/news/github-code-web-component.md", "text": "https://wpnews.pro/news/github-code-web-component.txt", "jsonld": "https://wpnews.pro/news/github-code-web-component.jsonld"}}