Windows 7 Aero Glass V2

Tags: windows, frutiger, aero, frutigeraero, live, windows7, windowsvista

Description:

This is a heavily optimized and modified version of my old Windows 7 layout, it now has animations, easier customization, more realism and even a PFP border.

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by IPTVman (https://layouts.spacehey.com/layout?id=34300) -->

<style>

@keyframes windowOpen {
	0% {
		opacity: 0.3;
		transform: perspective(600px) rotateX(-13deg) translateY(-5px) scale(0.85);
	}
	100% {
		opacity: 1;
		transform: perspective(600px) rotateX(0deg) rotateY(0deg) translateY(0px)
			scale(1);
	}
}

@font-face {
	font-family: 'Segoe UI';
	src: url('./fonts/normal/segoeui.eot');
	src: local("Segoe UI"),
		 local("Segoe"),
		 local("Segoe WP"),
		 url('https://win7.nota-robot.com/fonts/normal/segoeui.eot?#iefix') format('embedded-opentype'),
		 url('https://win7.nota-robot.com/fonts/normal/segoeui.woff') format('woff'),
		 url('https://win7.nota-robot.com/fonts/normal/segoeui.svg#SegoeUI') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Segoe UI Semibold';
	src: url('./fonts/semibold/seguisb.eot');
	src: local("Segoe Semibold"),
		 local("Segoe WP Semibold"),
		 url('https://win7.nota-robot.com/fonts/semibold/seguisb.eot?#iefix') format('embedded-opentype'),
		 url('https://win7.nota-robot.com/fonts/semibold/seguisb.woff') format('woff'),
		 url('https://win7.nota-robot.com/fonts/semibold/seguisb.svg#SegoeUISemibold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Segoe UI Bold';
	src: url('https://win7.nota-robot.com/fonts/bold/segoeuib.eot');
	src: local("Segoe Bold"),
		 local("Segoe WP Bold"),
		 url('https://win7.nota-robot.com/fonts/bold/segoeuib.eot?#iefix') format('embedded-opentype'),
		 url('https://win7.nota-robot.com/fonts/bold/segoeuib.woff') format('woff'),
		 url('https://win7.nota-robot.com/fonts/bold/segoeuib.svg#SegoeUI') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Segoe UI Light';
	src: url('https://win7.nota-robot.com/fonts/light/segoeuil.eot');
	src: local("Segoe UI Light"),
		 local("Segoe WP Light"),
		 url('https://win7.nota-robot.com/fonts/light/segoeuil.eot?#iefix') format('embedded-opentype'),
		 url('https://win7.nota-robot.com/fonts/light/segoeuil.woff') format('woff'),
		 url('https://win7.nota-robot.com/fonts/light/segoeuil.svg#SegoeUI') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {
  background-image: url(https://external-media.spacehey.net/media/sdn7meUeWIXeenMOhhumZzbGHheMZe_rUscErpxXb7zw=/https://static.miraheze.org/windowswallpaperwiki/5/50/Img0_%28Windows_7%29.jpg);
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

nav .top {
  background: none;
}
main {
  background: none;
}
nav .links {
  background: none;
}
nav .links a {
  text-shadow: 0px 0px 16px #ffffff,0px 0px 16px #ffffff,0px 0px 16px #ffffff,0px 0px 16px #ffffff !important;
}
* {
  font-size: 9pt !important;
  font-family: Segoe UI,sans-serif !important;
  color: black !important;
  text-decoration: none !important;
  cursor: context-menu !important;
  font-weight: normal !important;
  text-shadow: 0px 0px 16px #ffffff,0px 0px 16px #ffffff,0px 0px 16px #ffffff,0px 0px 16px #ffffff !important;
}
.container:before {
  border-radius: 6px;
  height: 100%;
  left: 0;
  top: 0;
  box-shadow: 0px 0px 15px 2px #000000c3, inset 0px 0px 0px 1px var(--aero-black), inset 0px 0px 0px 2px #d9e2eb;
  background: linear-gradient(#fff0 20%,hsla(0,0%,100%,.7) 29%,transparent 29.3%);
}
.container {
  animation:.5s windowOpen cubic-bezier(.19,1,.22,1);
  box-shadow: 0 0 15px 2px #000000c3,inset 0 0 0 1px var(--aero-black),inset 0 0 0 2px #d9e2eb;
  background: linear-gradient(-139deg,rgba(135,173,190,.47) 0%,rgba(0,0,0,0) 25%),var(--aero-accent);
  border-radius: 6px;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  padding: 8px;
}

:root {
	--accent: #74B8FC;
	--aero-white: #ffffff7a;
	--aero-black: #000000bd;
	--saturation: 100%;
	--brightness: 100%;
	--intensity: 80%;
	--aero-color: rgba( 116, 184, 252, calc(.7 * var(--intensity)) );
	--aero-accent: color-mix( in srgb, #000, color-mix(in srgb, var(--aero-color) var(--saturation), transparent) var(--brightness) );
}

footer {
	background: none !important;;
}

.container {
	background-image: url("https://i.imgur.com/O8DqcaX.png");
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
}

.logout-btn {
	color: black;
}

.logout-btn, .blog-entry .kudos-btn {
 color: black !important;
 font-size: 9pt;
 outline:none;
 border:solid thin #707070 !important;
 border-radius:3px;
 min-width:60px;
 padding:2px 12px;
 box-shadow:inset 0 0 0 1px var #ffffff7a !important;
 background:linear-gradient(180deg,rgba(242,242,242,1) 0%,rgba(235,235,235,1) 40%,rgba(221,221,221,1) 40%,rgba(207,207,207,1) 100%) !important;
 position:relative;
 z-index:1;
 transition:opacity .35s linear;
 text-decoration: none !important;
}

button {
 outline:none;
 border:solid thin #707070 !important;
 border-radius:3px;
 min-width:60px;
 padding:2px 12px;
 box-shadow:inset 0 0 0 1px var #ffffff7a !important;
 background:linear-gradient(180deg,rgba(242,242,242,1) 0%,rgba(235,235,235,1) 40%,rgba(221,221,221,1) 40%,rgba(207,207,207,1) 100%) !important;
 position:relative;
 z-index:1;
 transition:opacity .35s linear;
 cursor: context-menu !important;
}

button:hover {
 border:solid thin #3c7fb1 !important
}
button:before {
 position:absolute;
 content:"";
 top:0;
 right:0;
 bottom:0;
 left:0;
 background:linear-gradient(180deg,rgba(234,246,253,1) 0%,rgba(217,240,252,1) 40%,rgba(190,230,253,1) 40%,rgba(167,217,245,1) 100%) !important;
 z-index:-1;
 transition:opacity .35s linear;
 opacity:0;
 border-radius:3px
}
button:hover:before {
 opacity:1
}
button:after {
 box-shadow:inset 0 0 0 1px #95ade474 !important;
 position:absolute;
 content:"";
 top:0;
 right:0;
 bottom:0;
 left:0;
 background:linear-gradient(180deg,rgba(229,244,252,1) 0%,rgba(196,229,246,1) 40%,rgba(152,209,239,1) 40%,rgba(104,179,219,1) 100%) !important;
 z-index:-1;
 transition:opacity .1s linear;
 opacity:0;
 border-radius:3px
}
button:active:after {
 opacity:1
}

button {
	height: 22px;
	font-size: 9pt;
}

h1 {
	font-size: 15pt !important;
}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
  border: none !important;
}


.heading {
  background: none !important;
}
h4 {
  font-size: 11pt !important;
  padding-bottom: 2px;
}

input[type="text"] {
	border-top: solid thin #abadb3;
	border-left: solid thin #e2e3ea;
	border-bottom: solid thin #e3e9ef;
	border-right: solid thin #dbdfe6;
	outline: none;
	box-shadow: inset 0 0 0 1px var(--aero-white);
}
td {
  border-top: solid thin #abadb3;
  border-left: solid thin #e2e3ea;
  border-bottom: solid thin #e3e9ef;
  border-right: solid thin #dbdfe6;
  outline: none;
  box-shadow: inset 0 0 0 1px #ffffff57;
  background: #ffffffba !important;
  border-radius: 2px;
}
.icon {
}
td:before {
  opacity: ;
}
.general-about .profile-pic img {
  background-image: url("https://i.imgur.com/Nx0acPU.png");
  max-height: 149px;
  width: 144px;
  max-width: 100%;
  border: 0px solid rgba(.0,.0,.0,.0);
  padding: 25px;
  padding-top: 19px;
  border-radius: 2px;
}
.general-about .profile-pic {
  height: 138px;
}

.logo {
	content: url(https://i.imgur.com/pTl3Hkq.png);
	filter: drop-shadow(0px 0px 15px #fff) drop-shadow(0px 0px 15px #fff) !important;
}
</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 83 comments ( View all | Add Comment )

Milly	1754322980 Using the pfp code and frame, thanks ! Report Comment
oqureqz	1753873964 i am using it Report Comment
clearao	1752416637 used . 💚 Report Comment
Gu@d@	1752008175 Using x Report Comment
Ivy	1751322941 using!! (for my blogs) Report Comment
sketchy	1751133818 holy using this better then ur old one Report Comment
chlebak	1751119967 USING!!!! Report Comment
Raku	1750929551 using Report Comment
erosthesillygal	1750498433 using it :3 Report Comment
★Sharoodiedude⋆☆	1749979888 using >w< Report Comment
Michaellllll X33	1749838521 using!!! Report Comment
dogwater	1749427893 using :33 Report Comment
Zukin2763	1748568484 Using >:3 Report Comment
Goonstik	1746378271 using XD Report Comment
joeytho4821	1746095228 very nice Report Comment
jamiee	1746031422 usingg :] Report Comment
Your Stereotypical Nerd	1744428397 Using Report Comment
jade	1743725914 using Report Comment
Nexus_Stryker	1743012520 USING! LONG LIVE FRUTIGER AERO AND AERO GLASS!!! =D Report Comment
george	1741749059 stunning. Report Comment