Logo using CSS only in Genesis

This tutorial provides the different possibilities to show Logo in the site header using the CSS only without going to the customizer section.

Here are some different ways to add the logo in Genesis Sample.

Type 1

Supports PNG and SVG logo.

/* CUSTOM Title Area PNG or SVG
--------------------------------------------- */
.site-title > a {
    background: url(/images/logo.svg) no-repeat !important;
}

.title-area {
    float: left;
    height: 100%;
    min-height: 50px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 16px;
    padding: 0;
    min-width: 200px;
}
.site-title > a {
  background-size: contain !important;
  background-position: left center !important;
  float: left;
  min-height: 40px;
  width: 100%;
}

.site-title,
.site-description {
  display: block;
  height: 0;
  margin-bottom: 0;
  text-indent: -9999px;
}

Change the Logo path with URL of your logo. Minor changes are Required.