The icons.

How to use them

Drop blowers-icons.svg in at the top of the page, then point at the one you want. The icon inherits color, so you style it like text.

<svg class="ic" viewBox="0 0 24 24" aria-hidden="true"><use href="#bc-camera"></use></svg>

Or use one file on its own, from /assets/icons/svg/, which is what the download link on each icon gives you.

<img src="/assets/icons/svg/camera.svg" alt="" width="24" height="24" />

Size them in CSS and leave the stroke alone. They are drawn at 1.5 on a 24 grid, so they stay honest from 16 up to about 48. Past that, the hairlines get thin and you want artwork, not an icon.

An icon that carries meaning on its own needs a label. An icon sitting next to a word that already says the same thing is decoration, so hide it with aria-hidden and let the word do the work.

The mark

Two of these are the brand, not icons. bc-mark is the aperture flower exactly as the logo draws it, and bc-flower is the same bloom in outline for small sizes and single-color printing. They stay amber, bone, or ink, and nothing else. Do not gradient them, do not stretch them. The full logo files live on the brand page.

The rabbit is the mascot. It is allowed to turn up anywhere, which is the point of a mascot.

Editing the set

The sprite is the source. Add or change a symbol in assets/icons/blowers-icons.svg, then run python3 ops/make-icons.py, which rewrites the single files, the zip, and this page. Nothing here is typed twice.