Code HTML

<div class='modedark'>
	<input class='check' id='modedark' title='Mode Dark' type='checkbox' />
	<label class='iconmode' for='modedark'>
		<svg class='openmode' viewBox='0 0 24 24'>
			<path d='M12,18C11.11,18 10.26,17.8 9.5,17.45C11.56,16.5 13,14.42 13,12C13,9.58 11.56,7.5 9.5,6.55C10.26,6.2 11.11,6 12,6A6,6 0 0,1 18,12A6,6 0 0,1 12,18M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69Z' />
		</svg>
		<svg class='closemode' viewBox='0 0 24 24'>
			<path d='M14.3,16L13.6,14H10.4L9.7,16H7.8L11,7H13L16.2,16H14.3M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69M10.85,12.65H13.15L12,9L10.85,12.65Z' />
		</svg>
	</label>
</div>

Code Javascrip

<script type='text/javascript'>  
//<![CDATA[  
/* Night Mode/Dark Mode Feature - By anutrickz */   
$(document).ready(function(){$("body").toggleClass(localStorage.toggled),$("#modedark").on("click",function(){"nightmode"!=localStorage.toggled?($("body").toggleClass("nightmode",!0),localStorage.toggled="nightmode",$(".section-center").css("display","block")):($("body").toggleClass("nightmode",!1),localStorage.toggled="",$(".section-center").css("display",""))}),$("body").hasClass("nightmode")?$("#modedark").prop("checked",!0):$("#modedark").prop("checked",!1)});  
//]]>  
</script>

Code CSS

<style type='text/css'>

/*---- Night Mode/Dark Mode Feature - By anutrickz----*/
.modedark {
	background: linear-gradient(to right, #eb3349 40%, #f45c43);
	/*Background color of icon*/
	float: left;
	position: fixed;
	bottom: 0;
	/*Change this for position*/
	z-index: 999;
	opacity: 0.7
		/*Opacity Degree Of Icon*/
}

.modedark svg {
	width: 24px;
	height: 24px;
	vertical-align: -5px;
	background-repeat: no-repeat !important;
	content: &#39;
	&#39;
}

.modedark svg path {
	fill: #fff
}

.modedark .check:checked~.NavMenu {
	opacity: 1;
	visibility: visible;
	top: 45px;
	min-width: 200px;
	transition: all .3s ease;
	z-index: 2
}

.iconmode {
	cursor: pointer;
	display: block;
	padding: 8px;
	background-position: center;
	transition: all .5s linear
}

.iconmode:hover {
	border-radius: 100px;
	background: rgba(0, 0, 0, .2) radial-gradient(circle, transparent 2%, rgba(0, 0, 0, .2) 2%) center/15000%
}

.check {
	display: none
}

.modedark .iconmode .openmode {
	display: block
}

.modedark .iconmode .closemode {
	display: none
}

.modedark .check:checked~.iconmode .openmode {
	display: none
}

.modedark .check:checked~.iconmode .closemode {
	display: block
}

.nightmode {
	background: #15202B;
	color: rgba(255, 255, 255, .7)
}

</style>

// Start with .nightmode followed by element(class or id) {their_properties} You need to find element ids or classes in order for this to work. Add each element in the following way: .nightmode #outer-wrapper,.nightmode #sidebar-wrapper{background:#323232;color:#fff!important}