summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPaul Buetow <paul@buetow.org>2024-12-17 23:02:47 +0200
committerPaul Buetow <paul@buetow.org>2024-12-17 23:02:47 +0200
commitf8a5a12043275a48e4be060814a4b8a8b03ada6e (patch)
tree24899fdb5ec27da3dd4d7a7fbbf5832db44162c9
parente0da2b8918fa964cbe753ecfc5077b37a417080f (diff)
add pattern
-rw-r--r--style.css21
1 files changed, 20 insertions, 1 deletions
diff --git a/style.css b/style.css
index 078bb624..b8e25694 100644
--- a/style.css
+++ b/style.css
@@ -21,6 +21,25 @@
@font-face {
font-family: 'typewriter';
src: url("./typewriter.ttf") format("truetype");
+}
+
+/* https://css-pattern.com/ */
+html {
+ --s: 162px; /* control the size*/
+ --c1: #cd2942;
+ --c2: #62928c;
+ --c3: #e8cba9;
+ --c4: #33152e;
+ --c5: #414352;
+
+ --_g: conic-gradient(from 30deg at 50% 25%,#0000 300deg,var(--c1) 0);
+ background:
+ var(--_g) calc(0.2885*var(--s)) calc(7*var(--s)/12),
+ var(--_g) 0 calc(var(--s)/12),
+ conic-gradient(from 120deg at 50% calc(250%/3),var(--c2) 120deg,#0000 0),
+ repeating-conic-gradient(from 30deg,#0000 0 60deg,var(--c3) 0 120deg),
+ repeating-conic-gradient(var(--c4) 0 60deg,var(--c2) 0 120deg,var(--c5) 0 180deg);
+ background-size: calc(0.577*var(--s)) var(--s);
}
body {
@@ -30,7 +49,7 @@ body {
max-width: 1024px;
padding: 20px;
margin: 20px auto;
- border: 1px solid #333;
+ border: 5px double #ff6347;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
border-radius: 15px;
}