Truck icon
A hand-drawn truck 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
- Travel
- Grid
- 24 × 24
- Strokes
- 1.5 · 2 · 2.5
- Name
truck
Stroke weights and sizes
Use it in React Native
The Icon component draws truck by name, sized and coloured from your theme. Add it with npx @lumioui/cli add icon.
TSX Example.tsx
import { Icon } from "@/components/ui/icon";
<Icon name="truck" size={24} />
// colour and stroke follow your theme; pass color / strokeWidth to overrideSVG code
The still glyph. The animated version, linked above, plays its motion on its own with SMIL, so it needs no script.
SVG truck.svg
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g transform="translate(-0.5 -1)"><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M3.4 15.6L3.4 7.2C3.4 6.5 4 5.9 4.7 5.9L13.3 5.9C14 5.9 14.6 6.5 14.6 7.2L14.6 15.6"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M15.1 15.6L15.1 9.7C15.1 9.1 15.5 8.7 16.1 8.7L18.3 8.7C18.8 8.7 19.2 8.9 19.5 9.3L21.6 12.1C21.8 12.4 22 12.8 22 13.2L22 14.9C22 15.5 21.5 15.9 21 15.9L15.1 15.9Z"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M3.2 18L5.3 18M8.9 18L15.1 18M18.9 18L20.8 18"></path><circle stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" cx="7" cy="18" r="1.9"></circle><circle stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none" cx="17.2" cy="18" r="1.9"></circle></g></svg>On the web, link it straight from the CDN:
HTML index.html
<img src="https://cdn.lumioui.com/iconset/static/truck.svg" width="24" height="24" alt="Truck" />Where LumioUI uses it
- Cart Item component
- Address Card component
- Chat Composer component
- Choice Card component
- Notification Item component
- Timeline component
- Trip Progress component
- Onboarding Illustrated screen
- Empty States Set screen
- Help Center screen
- Address Book screen
- Delivery Options screen
- Order Detail screen
- Product Detail screen
- Returns screen
- Shop Assistant screen
- Tracking screen
- Food Cart screen
- Med Store screen
