Images and icons

#Where to look, in this order

1. The icon library, @wikicasa-dev/svg-icons. It has the icons and some illustrations: the images whose names end in Img (WikiNerdValutaDesktopImg, WikiNerdValutaMobileImg, WikiNerdDownloadAppImg…). Its index is in CLAUDE.md. Images need an id and a title.
2. The live site's file. If wikicasa.it shows it, wikicasa-nuxt has it in public/nuxt/img/ (for example Valuation/valuation-nerd-listing.svg, the "Valuta ora" illustration of the results). Copy it into this repo keeping its path after img/: layers/<domain>/public/img/Valuation/valuation-nerd-listing.svg. Devs then know it's the same file.
3. A new image. The designer saves the file in layers/<domain>/public/img/new/<domain>/, named in English with dashes (saved-search-empty.svg). Prefer SVG for illustrations and WebP for photos.

An image two domains use goes in layers/core/public/img/ instead, with the same paths. The path says where an image comes from, and the handoff reads it: img/new/ is new, anything else is the live site's file.

#Special cases

• Icons missing from the library: draw them like the set (stroke, size) and save them in layers/<domain>/public/img/new/icons/. The handoff lists them as icons to add to @wikicasa-dev/svg-icons.
• App Store and Google Play badges: official artwork only, unchanged, from Apple's and Google's badge pages (or wikicasa-nuxt, if it has them). They go in layers/core/public/img/badges/.
• Listing photos: they come from the mocks (app/mocks/), not from files. The mocks skill covers them.
• Maps: use DsMap, never a screenshot of a map.

#In the page

Files in a layer's public/ folder are served from the site's root: layers/search/public/img/new/search/empty.svg is /img/new/search/empty.svg.

<img src="/img/Valuation/valuation-nerd-listing.svg" alt="" width="120" height="120" />

Give every image its size, so the page doesn't jump while it loads. The alt text follows the accessibility guideline: empty for a decorative image, what it shows for a meaningful one.