diff --git a/skills/diagram-design/references/export.md b/skills/diagram-design/references/export.md index b1ec0ab..25e5c92 100644 --- a/skills/diagram-design/references/export.md +++ b/skills/diagram-design/references/export.md @@ -32,10 +32,10 @@ If the user explicitly asks for "a screenshot of the whole page including the ca - Ensure the opening tag has `xmlns="http://www.w3.org/2000/svg"`. Add it if missing. - Ensure a `viewBox` is present. The skill's templates always include one; warn the user if absent rather than guessing. - Preserve `role="img"`, `aria-labelledby`, and the first-child `` / `<desc>` exactly as authored. - - Inject Google Fonts `@import` so the SVG renders with correct typography in a browser: + - Inject Google Fonts `@import` so the SVG renders with correct typography in a browser. **XML-escape the `&` separators as `&`** — a standalone `.svg` is parsed as strict XML, where a bare `&` starts an entity reference and makes the whole file fail to parse. (Don't copy the raw URL from the HTML `<link href>`; that ampersand form is only valid in HTML.) ```svg <defs> - <style>@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap');</style> + <style>@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap');</style> </defs> ``` If the SVG already contains a `<defs>` block, **merge** the `<style>` into it (don't add a second `<defs>`).