Border Style Dashed Icon SVG
Border Style Dashed
Border style dashed SVG Icon Code | Customize color You can get svg icon border style dashed in blue, white, red color and transparent color from below list. You can also customize color using color picker.
Border style dashed
Svg Code <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M4 11H8V13H4V11Z" fill="currentColor" /> <path d="M10 11H14V13H10V11Z" fill="currentColor" /> <path d="M20 11H16V13H20V11Z" fill="currentColor" /> </svg>
Border style dashed
Svg Code <svg style="color: white" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M4 11H8V13H4V11Z" fill="white" ></path> <path d="M10 11H14V13H10V11Z" fill="white" ></path> <path d="M20 11H16V13H20V11Z" fill="white" ></path> </svg>
Border style dashed
Svg Code <svg style="color: red" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M4 11H8V13H4V11Z" fill="red" ></path> <path d="M10 11H14V13H10V11Z" fill="red" ></path> <path d="M20 11H16V13H20V11Z" fill="red" ></path> </svg>
Border style dashed
Svg Code <svg style="color: blue" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M4 11H8V13H4V11Z" fill="blue" ></path> <path d="M10 11H14V13H10V11Z" fill="blue" ></path> <path d="M20 11H16V13H20V11Z" fill="blue" ></path> </svg>
Border style dashed
Svg Code <svg style="color: #f3da35" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M4 11H8V13H4V11Z" fill="#f3da35" ></path> <path d="M10 11H14V13H10V11Z" fill="#f3da35" ></path> <path d="M20 11H16V13H20V11Z" fill="#f3da35" ></path> </svg>
Advance Editor You can edit border style dashed as below. Change size color and background color of icon using below tool.
Fullscreen
tab 2 content
Tab 3 content
Customize