45 lines
2.4 KiB
HTML
45 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>flexozyme</title>
|
|
</head>
|
|
<!-- The black 180deg in the conic gradient ensures the colorful part of the gradient spans a 90deg arc -->
|
|
<body style="height:100vh;margin:0;display:flex">
|
|
<div style="flex:2;background-image:conic-gradient(from 270deg at 100% 100%,red,orange,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:column">
|
|
<div style="flex:2;background-image:conic-gradient(at 0% 100%,orange,yellow,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:row-reverse">
|
|
<div style="flex:2;background-image:conic-gradient(from 90deg at 0% 0%,yellow,green,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:column-reverse">
|
|
<div style="flex:2;background-image:conic-gradient(from 180deg at 100% 0%,green,blue,black 180deg)"></div>
|
|
<div style="flex:1;display:flex">
|
|
<div style="flex:2;background-image:conic-gradient(from 270deg at 100% 100%,blue,purple,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:column">
|
|
<div style="flex:2;background-image:conic-gradient(at 0% 100%,purple,red,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:row-reverse">
|
|
<div style="flex:2;background-image:conic-gradient(from 90deg at 0% 0%,red,orange,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:column-reverse">
|
|
<div style="flex:2;background-image:conic-gradient(from 180deg at 100% 0%,orange,yellow,black 180deg)"></div>
|
|
<div style="flex:1;display:flex">
|
|
<div style="flex:2;background-image:conic-gradient(from 270deg at 100% 100%,yellow,green,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:column">
|
|
<div style="flex:2;background-image:conic-gradient(at 0% 100%,green,blue,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:row-reverse">
|
|
<div style="flex:2;background-image:conic-gradient(from 90deg at 0% 0%,blue,purple,black 180deg)"></div>
|
|
<div style="flex:1;display:flex;flex-direction:column-reverse">
|
|
<div style="flex:2;background-image:conic-gradient(from 180deg at 100% 0%,purple,red,black 180deg)"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|