Vector Drawing Widget
The Vector Drawing Widget enables custom SVG graphics on your dashboard.
Description
Section titled “Description”For advanced users who want to break free from standard shapes. This widget renders raw SVG path data, allowing you to create custom icons, floorplan paths, or complex artistic flourishes.
Key Features
Section titled “Key Features”- Custom Paths: Paste any SVG
dpath string. - Styling: Full control over Fill Color, Stroke Color, and Stroke Width.
- Effects: Supports the same “Lifted” or “Sunken” shadow effects as Visual Boxes for a 3D look.
- Actions: Can be made clickable to trigger services or navigation.
Configuration
Section titled “Configuration”- SVG Path: The coordinate data for the shape.
Appearance
Section titled “Appearance”- Fill/Stroke: Colors for the inside and outline.
- Transforms: Rotate, flip, or apply 3D perspective transforms.
Use Cases
Section titled “Use Cases”- Floorplans: Draw the walls of your room.
- Custom Icons: Use a unique logo not found in the standard icon set.
- Decorations: Squiggles, waves, or abstract patterns to separate sections.
Build this on your own dashboard
Dashable is a drag-and-drop dashboard builder for Home Assistant. Connect your instance and lay out widgets in the browser — no YAML.
Try Dashable free