Revision as of 15:39, 2 September 2025

👋 Welcome to the

Arr P Wiki

The Cirque d'Eventide, The Next Pantheon, and HoYoverse wiki... plus more!

Search the Arr P Wiki/

   </style>

</head> <body>

CSS Custom Property Palette

Border-Related Colors

--rp-hairline-bg

--rp-date-divider

--rp-border-color-base

--rp-border-color-emphasized

Surface/Background Colors

--rp-color-surface-0

--rp-color-surface-1

--rp-color-surface-2

--rp-color-surface-3

--rp-color-surface-4

--rp-color-surface-5

MediaWiki has been installed.

Consult the User's Guide for information on using the wiki software.

@@ Line 1: / Line 1: @@
 {{Main page/header}}
-    <div class="container">
-        <h1 class="section-title" style="font-size: 32px;">CSS Custom Property Palette</h1>
-        <!-- Border Colors Section -->
+    </style>
-        <div>
+</head>
-            <h2 class="section-title">Border-Related Colors</h2>
+<body>
-            <div class="color-grid">
-                <div>
-                    <div class="color-box" style="border-color: var(--rp-hairline-bg);">
-                        <div class="color-swatch" style="background-color: var(--rp-hairline-bg);"></div>
-                        <span>--rp-hairline-bg</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="border-color: var(--rp-date-divider);">
-                        <div class="color-swatch" style="background-color: var(--rp-date-divider);"></div>
-                        <span>--rp-date-divider</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="border-color: var(--rp-border-color-base);">
-                        <div class="color-swatch" style="background-color: var(--rp-border-color-base);"></div>
-                        <span>--rp-border-color-base</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="border-color: var(--rp-border-color-emphasized);">
-                        <div class="color-swatch" style="background-color: var(--rp-border-color-emphasized);"></div>
-                        <span>--rp-border-color-emphasized</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <!-- Background Colors Section -->
+<div class="container">
-        <div>
+<h1 class="section-title" style="font-size: 32px;">CSS Custom Property Palette</h1>
-            <h2 class="section-title">Surface/Background Colors</h2>
-            <div class="color-grid">
-                <div>
-                    <div class="color-box" style="background-color: var(--rp-color-surface-0);">
-                        <div class="color-swatch" style="background-color: var(--rp-color-surface-0);"></div>
-                        <span>--rp-color-surface-0</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="background-color: var(--rp-color-surface-1);">
-                        <div class="color-swatch" style="background-color: var(--rp-color-surface-1);"></div>
-                        <span>--rp-color-surface-1</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="background-color: var(--rp-color-surface-2);">
-                        <div class="color-swatch" style="background-color: var(--rp-color-surface-2);"></div>
-                        <span>--rp-color-surface-2</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="background-color: var(--rp-color-surface-3);">
-                        <div class="color-swatch" style="background-color: var(--rp-color-surface-3);"></div>
-                        <span>--rp-color-surface-3</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="background-color: var(--rp-color-surface-4);">
-                        <div class="color-swatch" style="background-color: var(--rp-color-surface-4);"></div>
-                        <span>--rp-color-surface-4</span>
-                    </div>
-                </div>
-                <div>
-                    <div class="color-box" style="background-color: var(--rp-color-surface-5);">
-                        <div class="color-swatch" style="background-color: var(--rp-color-surface-5);"></div>
-                        <span>--rp-color-surface-5</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
+<div>
+<h2 class="section-title">Border-Related Colors</h2>
+<div class="color-grid">
+<div>
+<div class="color-box" style="border-color: var(--rp-hairline-bg);">
+<div class="color-swatch" style="background-color: var(--rp-hairline-bg);"></div>
+<span>--rp-hairline-bg</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="border-color: var(--rp-date-divider);">
+<div class="color-swatch" style="background-color: var(--rp-date-divider);"></div>
+<span>--rp-date-divider</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="border-color: var(--rp-border-color-base);">
+<div class="color-swatch" style="background-color: var(--rp-border-color-base);"></div>
+<span>--rp-border-color-base</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="border-color: var(--rp-border-color-emphasized);">
+<div class="color-swatch" style="background-color: var(--rp-border-color-emphasized);"></div>
+<span>--rp-border-color-emphasized</span>
+</div>
+</div>
+</div>
+</div>
+<div>
+<h2 class="section-title">Surface/Background Colors</h2>
+<div class="color-grid">
+<div>
+<div class="color-box" style="background-color: var(--rp-color-surface-0);">
+<div class="color-swatch" style="background-color: var(--rp-color-surface-0);"></div>
+<span>--rp-color-surface-0</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="background-color: var(--rp-color-surface-1);">
+<div class="color-swatch" style="background-color: var(--rp-color-surface-1);"></div>
+<span>--rp-color-surface-1</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="background-color: var(--rp-color-surface-2);">
+<div class="color-swatch" style="background-color: var(--rp-color-surface-2);"></div>
+<span>--rp-color-surface-2</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="background-color: var(--rp-color-surface-3);">
+<div class="color-swatch" style="background-color: var(--rp-color-surface-3);"></div>
+<span>--rp-color-surface-3</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="background-color: var(--rp-color-surface-4);">
+<div class="color-swatch" style="background-color: var(--rp-color-surface-4);"></div>
+<span>--rp-color-surface-4</span>
+</div>
+</div>
+<div>
+<div class="color-box" style="background-color: var(--rp-color-surface-5);">
+<div class="color-swatch" style="background-color: var(--rp-color-surface-5);"></div>
+<span>--rp-color-surface-5</span>
+</div>
+</div>
+</div>
+</div>
+</div>
 <strong>MediaWiki has been installed.</strong>

Main Page: Difference between revisions

Revision as of 15:39, 2 September 2025

Arr P Wiki

CSS Custom Property Palette

Border-Related Colors

Surface/Background Colors

Getting started