Menu:
Appearance > Design
html
You can add any SVG code to your site’s header, without having to create a child theme.
url: /wp-admin/themes.php?page=design#header
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="display: none;">
<symbol id="my-logo" viewBox="0 0 466 466">
<title>My Logo</title>
<desc>You can edit this logo</desc>
<circle cx="233" cy="233" r="231" class="yang"/>
<path d="M 233,459 a 226 226 0 0 1 0,-452 a 113 113 0 0 1 0,226 z" class="yin"/>
<circle cx="233" cy="346" r="113" class="yang"/>
<circle cx="233" cy="120" r="30" class="yang"/>
<circle cx="233" cy="346" r="30" class="yin""/>
</symbol>
</svg>
<svg class="header-logo"><use xlink:href="#my-logo" /></svg>
Design/CSS
you can edit the design for your logo in your child theme or custom CSS area.
url: /wp-admin/themes.php?page=design#advanced
.header-logo {
width: @siteTitleSize;
height: @siteTitleSize;
line-height: 1em;
margin: 0 .5em -.5em 0;
}
.yin {
fill: @siteDescriptionColor;
}
.yang {
fill: @siteTitleColor;
}
Resources:
CSS Trick – Using SVG