Coding and Data

Create an Accessible SVG Icon

Render and inspect the SVG at small and large sizes. Sanitize generated SVG before accepting user-controlled content.

Prompt

MetaCyberGuru reviewed
Create an SVG icon for [CONCEPT] at [SIZE]. Use a simple viewBox, scalable paths, currentColor where appropriate and no external resources. If the icon conveys meaning, include a concise title and explain the accessible name needed in HTML. If it is decorative, mark it for aria-hidden use. Return the SVG code, a short usage example and checks for contrast, focus and scaling.

What to customize

  • [CONCEPT]
  • [SIZE]

Expected output

Self-contained SVG code, accessible integration guidance and visual verification checks.

Check before you rely on it

AI output can be incomplete or wrong. Verify facts, run code, check citations and keep private data out of tools that your organization has not approved.

Related prompts

View the category