mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 05:00:22 +08:00
73 lines
No EOL
2.5 KiB
HTML
73 lines
No EOL
2.5 KiB
HTML
<div class="container"></div>
|
|
|
|
<style>
|
|
/* From Uiverse.io by vikas7754 - Tags: simple, clean, pattern */
|
|
.container {
|
|
width: 100%;
|
|
height: 100%;
|
|
/* Add your background pattern here */
|
|
--sz: 15px;
|
|
--c0: #000;
|
|
--c1: #c71175;
|
|
--ts: 50% / calc(var(--sz) * 8) calc(var(--sz) * 16);
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
--dot: var(--c1) 0 calc(var(--sz) * 0.78),
|
|
#fff0 calc(calc(var(--sz) * 0.78) + 1px) 100%;
|
|
--dot2: radial-gradient(circle at 90% 0%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 65% 0%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 40% 0%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 15% 0%, var(--dot)) var(--ts);
|
|
--cg1: conic-gradient(from -90deg at 5% 51%, var(--c0) 0 90deg, #fff0 0 100%)
|
|
var(--ts);
|
|
--cg2: conic-gradient(from -90deg at 25% 50%, var(--c1) 0 90deg, #fff0 0 100%)
|
|
var(--ts);
|
|
--cg3: conic-gradient(
|
|
from -90deg at 30% 38.5%,
|
|
var(--c0) 0 90deg,
|
|
#fff0 0 100%
|
|
)
|
|
var(--ts);
|
|
--cg4: conic-gradient(
|
|
from -90deg at 50% 37.5%,
|
|
var(--c1) 0 90deg,
|
|
#fff0 0 100%
|
|
)
|
|
var(--ts);
|
|
--cg5: conic-gradient(from -90deg at 55% 26%, var(--c0) 0 90deg, #fff0 0 100%)
|
|
var(--ts);
|
|
--cg6: conic-gradient(from -90deg at 75% 25%, var(--c1) 0 90deg, #fff0 0 100%)
|
|
var(--ts);
|
|
--cg7: conic-gradient(
|
|
from -90deg at 80% 13.5%,
|
|
var(--c0) 0 90deg,
|
|
#fff0 0 100%
|
|
)
|
|
var(--ts);
|
|
--cg8: conic-gradient(
|
|
from -90deg at 100% 12.5%,
|
|
var(--c1) 0 90deg,
|
|
#fff0 0 100%
|
|
)
|
|
var(--ts);
|
|
|
|
background: var(--dot2), var(--dot2),
|
|
radial-gradient(circle at 90% 100%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 65% 100%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 40% 100%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 15% 100%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 90% 12.5%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 65% 25%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 40% 37.5%, var(--dot)) var(--ts),
|
|
radial-gradient(circle at 15% 50%, var(--dot)) var(--ts), var(--cg1),
|
|
var(--cg1), var(--cg2), var(--cg2), var(--cg3), var(--cg3), var(--cg4),
|
|
var(--cg4), var(--cg5), var(--cg5), var(--cg6), var(--cg6), var(--cg7),
|
|
var(--cg7), var(--cg8), var(--cg8),
|
|
linear-gradient(-45deg, #fff0 0 32.25%, #0002 50%, #000 77.5%) var(--ts),
|
|
linear-gradient(-45deg, #fff0 0 32.25%, #000 60%) var(--ts),
|
|
repeating-linear-gradient(90deg, var(--c0) 0 5%, var(--c1) 0 25%) var(--ts);
|
|
}
|
|
|
|
</style>
|
|
|