Virus icon
A hand-drawn virus icon that animates on its own: an SVG on a 24px grid in thin, regular and bold strokes. Free to download and use in the apps you build (LumioUI License). It takes your text colour through currentColor.
- Category
- Health
- Grid
- 24 × 24
- Strokes
- 1.5 · 2 · 2.5
- Name
virus
Stroke weights and sizes
Use it in React Native
Paste the SVG into react-native-svg's SvgXml. The Icon component covers a curated set by name, and Animated Icons plays the motion natively.
TSX VirusIcon.tsx
import { SvgXml } from "react-native-svg";
const VirusIcon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g><circle stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" cx="12" cy="12" r="5.2"></circle><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M12 6.8L12 5.2M15.7 8.3L16.8 7.2M17.2 12L18.8 12M15.7 15.7L16.8 16.8M12 17.2L12 18.8M8.3 15.7L7.2 16.8M6.8 12L5.2 12M8.3 8.3L7.2 7.2M9.9 11.2L9.9 11.6M12.2 13.6L12.2 14M14.1 10.6L14.1 11"></path><path stroke="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="currentColor" d="M11 4.4A1 1 0 1 0 13 4.4A1 1 0 1 0 11 4.4M16.6 6.4A1 1 0 1 0 18.6 6.4A1 1 0 1 0 16.6 6.4M18.6 12A1 1 0 1 0 20.6 12A1 1 0 1 0 18.6 12M16.6 17.6A1 1 0 1 0 18.6 17.6A1 1 0 1 0 16.6 17.6M11 19.6A1 1 0 1 0 13 19.6A1 1 0 1 0 11 19.6M5.4 17.6A1 1 0 1 0 7.4 17.6A1 1 0 1 0 5.4 17.6M3.4 12A1 1 0 1 0 5.4 12A1 1 0 1 0 3.4 12M5.4 6.4A1 1 0 1 0 7.4 6.4A1 1 0 1 0 5.4 6.4"></path></g></svg>`;
<SvgXml xml={VirusIcon} width={24} height={24} color="#111" />SVG code
The still glyph. The animated version, linked above, plays its motion on its own with SMIL, so it needs no script.
SVG virus.svg
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g><circle stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" cx="12" cy="12" r="5.2"></circle><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M12 6.8L12 5.2M15.7 8.3L16.8 7.2M17.2 12L18.8 12M15.7 15.7L16.8 16.8M12 17.2L12 18.8M8.3 15.7L7.2 16.8M6.8 12L5.2 12M8.3 8.3L7.2 7.2M9.9 11.2L9.9 11.6M12.2 13.6L12.2 14M14.1 10.6L14.1 11"></path><path stroke="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="currentColor" d="M11 4.4A1 1 0 1 0 13 4.4A1 1 0 1 0 11 4.4M16.6 6.4A1 1 0 1 0 18.6 6.4A1 1 0 1 0 16.6 6.4M18.6 12A1 1 0 1 0 20.6 12A1 1 0 1 0 18.6 12M16.6 17.6A1 1 0 1 0 18.6 17.6A1 1 0 1 0 16.6 17.6M11 19.6A1 1 0 1 0 13 19.6A1 1 0 1 0 11 19.6M5.4 17.6A1 1 0 1 0 7.4 17.6A1 1 0 1 0 5.4 17.6M3.4 12A1 1 0 1 0 5.4 12A1 1 0 1 0 3.4 12M5.4 6.4A1 1 0 1 0 7.4 6.4A1 1 0 1 0 5.4 6.4"></path></g></svg>On the web, link it straight from the CDN:
HTML index.html
<img src="https://cdn.lumioui.com/iconset/static/virus.svg" width="24" height="24" alt="Virus" />
