Tree Diagram Icon SVG
Tree Diagram
Tree diagram SVG Icon Code | Customize color
You can get svg icon tree diagram in blue, white, red color and transparent color from below list. You can also customize color using color picker.
CustomizeTree diagram
DownloadSvg Code
<?xml version="1.0" encoding="UTF-8"?><svg width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="10" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="38" r="4" fill="none" stroke="#333" stroke-width="1"/><path d="M34 38L22 38V10H34" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 24L34 24" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg> Tree diagram
DownloadSvg Code
<?xml version="1.0" encoding="UTF-8"?><svg style='color: white' width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="10" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="38" r="4" fill="none" stroke="#333" stroke-width="1"/><path d="M34 38L22 38V10H34" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 24L34 24" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg> Tree diagram
DownloadSvg Code
<?xml version="1.0" encoding="UTF-8"?><svg style='color: red' width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="10" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="38" r="4" fill="none" stroke="#333" stroke-width="1"/><path d="M34 38L22 38V10H34" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 24L34 24" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg> Tree diagram
DownloadSvg Code
<?xml version="1.0" encoding="UTF-8"?><svg style='color: blue' width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="10" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="38" r="4" fill="none" stroke="#333" stroke-width="1"/><path d="M34 38L22 38V10H34" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 24L34 24" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg> Tree diagram
DownloadSvg Code
<?xml version="1.0" encoding="UTF-8"?><svg style='color: #f3da35' width="45" height="45" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="10" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="24" r="4" fill="none" stroke="#333" stroke-width="1"/><circle cx="38" cy="38" r="4" fill="none" stroke="#333" stroke-width="1"/><path d="M34 38L22 38V10H34" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/><path d="M14 24L34 24" stroke="#333" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg> Advance Editor
You can edit tree diagram as below. Change size color and background color of icon using below tool.
Advertisements
Advertisements