add fancy background
This commit is contained in:
parent
9672508858
commit
42b492b6c3
13
index.css
13
index.css
@ -14,6 +14,19 @@ html {
|
||||
color: var(--foreground);
|
||||
}
|
||||
|
||||
html::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: -1;
|
||||
|
||||
--gradient-angle: 0deg;
|
||||
background: conic-gradient(from var(--gradient-angle) in hsl longer hue, hsl(0deg 100% 12.5%) 0 0);
|
||||
mask-image: url("pattern.svg");
|
||||
mask-size: 5rem;
|
||||
animation: rotation 300s infinite linear;
|
||||
}
|
||||
|
||||
body {
|
||||
min-height: 100vh;
|
||||
margin: 0;
|
||||
|
14
pattern.svg
Normal file
14
pattern.svg
Normal file
@ -0,0 +1,14 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="-86.6025 -150 173.205 300">
|
||||
<defs>
|
||||
<path id="star" stroke-linejoin="round" stroke="white" fill="white"
|
||||
d="M0 -100 1.73205 -1 86.6025 50 0 2 -86.6025 50 -1.73205 -1 Z" />
|
||||
</defs>
|
||||
|
||||
<g id="group">
|
||||
<use href="#star" x="0" y="-50"/>
|
||||
<use href="#star" x="-86.6025" y="100"/>
|
||||
<use href="#star" x="86.6025" y="100"/>
|
||||
</g>
|
||||
<use href="#group" x="0" y="0" transform="scale(-1)"/>
|
||||
</svg>
|
After Width: | Height: | Size: 543 B |
Loading…
x
Reference in New Issue
Block a user