Appearance > Design



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="" 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""/>
<svg class="header-logo"><use xlink:href="#my-logo" /></svg>



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;


CSS Trick – Using SVG