Olympic Torch icon
A hand-drawn olympic torch 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
- Sports
- Grid
- 24 × 24
- Strokes
- 1.5 · 2 · 2.5
- Name
olympic-torch
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 OlympicTorchIcon.tsx
import { SvgXml } from "react-native-svg";
const OlympicTorchIcon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g transform="translate(-1.25 0)"><g><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M15.73 10.36C13.83 10.36 12.33 8.86 12.33 6.96C12.33 4.56 14.33 2.86 16.63 2.26C16.83 3.46 17.63 4.46 18.83 4.96C20.43 5.56 21.63 7.06 21.63 8.86C21.63 11.06 19.83 12.86 17.63 12.86L15.73 12.86Z"></path></g><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M10.43 12.56C9.43 11.46 9.53 7.66 9.53 7.66L18.43 16.56S14.63 16.66 13.43 15.66"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M10.33 12.86L5.13 19.86C4.73 20.36 4.83 21.06 5.23 21.46C5.73 21.86 6.33 21.86 6.83 21.36L14.13 14.26"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M8.83 10.56L15.63 17.36"></path></g></svg>`;
<SvgXml xml={OlympicTorchIcon} 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 olympic-torch.svg
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g transform="translate(-1.25 0)"><g><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M15.73 10.36C13.83 10.36 12.33 8.86 12.33 6.96C12.33 4.56 14.33 2.86 16.63 2.26C16.83 3.46 17.63 4.46 18.83 4.96C20.43 5.56 21.63 7.06 21.63 8.86C21.63 11.06 19.83 12.86 17.63 12.86L15.73 12.86Z"></path></g><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M10.43 12.56C9.43 11.46 9.53 7.66 9.53 7.66L18.43 16.56S14.63 16.66 13.43 15.66"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M10.33 12.86L5.13 19.86C4.73 20.36 4.83 21.06 5.23 21.46C5.73 21.86 6.33 21.86 6.83 21.36L14.13 14.26"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M8.83 10.56L15.63 17.36"></path></g></svg>On the web, link it straight from the CDN:
HTML index.html
<img src="https://cdn.lumioui.com/iconset/static/olympic-torch.svg" width="24" height="24" alt="Olympic Torch" />
