Virus icon

New Added in v0.5.0

A free pencil-style virus icon, drawn by code from 1 circle, 8 lines and 10 dots. Use it as an SVG, a React component, or by name. MIT licensed.

virus

01Use it

Use virus

One package, four ways in. The icon inherits currentColor and is decorative unless you give it a title. Install it with npm i @matita/icons.

React

import { Virus } from '@matita/icons/react';

<Virus size={24} />

// or by name
import { SketchIcon } from '@matita/icons/react';
<SketchIcon name="virus" />

JavaScript

import { Virus, toSvg } from '@matita/icons';

toSvg(Virus, { size: 24 });   // SVG string

SVG

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" overflow="visible" class="sketch-icon sketch-icon-virus" data-sketch="" aria-hidden="true"><path d="M9.37 16.87C9.13 16.7 8.27 16.32 7.92 15.87C7.56 15.42 7.42 14.73 7.23 14.16C7.04 13.58 6.85 13.01 6.78 12.41C6.72 11.82 6.74 11.18 6.84 10.58C6.95 9.97 7.11 9.32 7.42 8.8C7.72 8.29 8.21 7.88 8.67 7.5C9.13 7.13 9.62 6.8 10.15 6.56C10.68 6.32 11.27 6.09 11.84 6.06C12.41 6.02 13.02 6.17 13.58 6.35C14.13 6.54 14.69 6.81 15.16 7.18C15.62 7.55 16 8.05 16.36 8.55C16.71 9.05 17.12 9.59 17.29 10.17C17.46 10.76 17.44 11.46 17.4 12.08C17.37 12.7 17.25 13.32 17.07 13.92C16.9 14.51 16.71 15.15 16.37 15.66C16.04 16.17 15.55 16.59 15.07 16.96C14.58 17.33 14.05 17.7 13.48 17.87C12.92 18.04 11.98 17.96 11.68 17.98" stroke-width="1.76"/><path d="M11.99 7Q11.94 5.2 11.9 3.4" stroke-width="1.648"/><path d="M11.84 17.17Q12.13 19.08 12.19 20.99" stroke-width="1.616"/><path d="M5.67 11.95Q4.25 12.07 2.83 12.01" stroke-width="1.744"/><path d="M17.22 12.11Q19.21 11.98 21.2 11.82" stroke-width="1.424"/><path d="M15.71 8.49Q17.17 7.1 18.52 5.6" stroke-width="1.408"/><path d="M8.37 8.23Q7.04 7.09 5.86 5.79" stroke-width="1.52"/><path d="M15.9 15.68Q17.17 17.06 18.55 18.33" stroke-width="1.648"/><path d="M8.38 15.53Q7.13 17.05 5.72 18.41" stroke-width="1.616"/><path d="M11.93 2.18l.01 0M12.02 21.74l.01 0M2.17 11.96l.01 0M21.74 11.9l.01 0M18.87 4.93l.01 0M4.87 5.18l.01 0M19.12 19.12l.01 0M4.94 19.03l.01 0M10.6 10.38l.01 0M13.4 13.05l.01 0" stroke-width="2.48"/></svg>

Pencil variant

import '@matita/icons/pencil.css';
import { Virus } from '@matita/icons/react';

<Virus size={32} pencil />

The file is icons/virus.svg in the package (pencil/virus.svg for the pencil variant). Matita 0.5.1.

02How it's drawn

The recipe for virus

Virus is not stored as a drawing. It is a recipe of 1 circle, 8 lines and 10 dots on a 24 by 24 grid, and a small program draws it like a pencil would. The wobble comes from the name, so it always comes out the same.

A · Recipe
C 12 12 5.5;
L 12 6.5 12 3.4;
O 12 2.2;
L 12 17.5 12 20.6;
O 12 21.8;
L 5.5 12 3.4 12;
O 2.2 12;
L 17.5 12 20.6 12;
O 21.8 12;
L 15.89 8.11 18.08 5.92;
O 18.93 5.07;
L 8.11 8.11 5.92 5.92;
O 5.07 5.07;
L 15.89 15.89 18.08 18.08;
O 18.93 18.93;
L 8.11 15.89 5.92 18.08;
O 5.07 18.93;
O 10.5 10.5;
O 13.5 13
B · Plotted
C · Drawn
How it works

03Takes, sizes, pencil

Same icon, every way

Pass a seed for another take of the same recipe. The wobble is capped, so it still reads at 16 px.

seed 0
seed 1
seed 2
seed 3
seed 4

Five seeds of virus. Seed 0 is the default.

wobble 0
wobble 0.25
wobble 0.5
wobble 0.75
wobble 1

virus from exact shapes (wobble 0) to the full hand (wobble 1, the default). The exact version is also a ready-made file: exact/virus.svg.

16 px
20 px
24 px
32 px
48 px
96 px

True pixel sizes.

Ink
Pencil