Elias/Website
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added colors

Browse Source
This commit is contained in:
Elias Fink
2025-06-25 17:40:21 +02:00
parent 2fd2b26b4f
commit 7c4e922681
1 changed files with 105 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
colors/index.php Normal file
View File

@@ -0,0 +1,105 @@
<?php include "../html-head.php"; ?>
<link rel="stylesheet" href="https://static.eliasfink.de/fonts/montserrat/montserrat.css">
<style>
* {
margin: 0;
padding: 0;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}
#content {
top: 50%;
left: 50%;
width: 100%;
max-width: 500px;
position: absolute;
transform: translate(-50%, -50%);
}
.color-palette {
width: 100%;
max-width: 500px;
}
.single-color {
width: 20%;
float: left;
text-align: center;
display: inline-block;
}
.single-color div {
padding-top: 50%;
margin-top: 50px;
margin-bottom: 2px;
}
</style>
<title>Colors &ndash; eliasfink.de</title>
</head>
<body>
<div id="content">
<div id="blue" class="color-palette">
<div class="single-color">
<div style="background-color: var(--blue-1);"></div>
<span>#001A33</span>
</div>
<div class="single-color">
<div style="background-color: var(--blue-2);"></div>
<span>#004D99</span>
</div>
<div class="single-color">
<div style="background-color: var(--blue-3);"></div>
<span>#0080FF</span>
</div>
<div class="single-color">
<div style="background-color: var(--blue-4);"></div>
<span>#66B3FF</span>
</div>
<div class="single-color">
<div style="background-color: var(--blue-5);"></div>
<span>#CCE6FF</span>
</div>
</div>
<div id="grey" class="color-palette">
<div class="single-color">
<div style="background-color: var(--grey-1);"></div>
<span>#161A1D</span>
</div>
<div class="single-color">
<div style="background-color: var(--grey-2);"></div>
<span>#434D56</span>
</div>
<div class="single-color">
<div style="background-color: var(--grey-3);"></div>
<span>#708090</span>
</div>
<div class="single-color">
<div style="background-color: var(--grey-4);"></div>
<span>#A9B3BC</span>
</div>
<div class="single-color">
<div style="background-color: var(--grey-5);"></div>
<span>#E2E6E9</span>
</div>
</div>
</div>
</body>
</html>