diff --git a/public/index.css b/public/index.css
index d656a578f..23082b8d6 100644
--- a/public/index.css
+++ b/public/index.css
@@ -134,9 +134,6 @@ a.address {
   overflow-x: hidden;
   padding: 1rem;
 }
-.faded {
-  color: var(--color-foreground-5);
-}
 .off-centered {
   height: 100%;
   padding-top: 5rem;
diff --git a/public/typography.css b/public/typography.css
index 40b302585..4d8650363 100644
--- a/public/typography.css
+++ b/public/typography.css
@@ -54,20 +54,6 @@ p {
   color: var(--color-secondary);
 }
 
-.txt-title {
-  font-size: var(--font-size-large);
-  font-weight: var(--font-weight-normal);
-  color: var(--color-secondary);
-  text-align: left;
-  text-overflow: ellipsis;
-  overflow-x: hidden;
-}
-
-.txt-missing {
-  color: var(--color-foreground-5);
-  font-style: italic;
-}
-
 .txt-tiny {
   font-size: var(--font-size-tiny);
 }
@@ -93,3 +79,18 @@ p {
 .txt-bold {
   font-weight: var(--font-weight-bold) !important;
 }
+.txt-missing {
+  color: var(--color-foreground-5);
+  font-style: italic;
+}
+.txt-faded {
+  color: var(--color-foreground-5);
+}
+.txt-title {
+  font-size: var(--font-size-large);
+  font-weight: var(--font-weight-normal);
+  color: var(--color-secondary);
+  text-align: left;
+  text-overflow: ellipsis;
+  overflow-x: hidden;
+}
diff --git a/src/Form.svelte b/src/Form.svelte
index a81f8879e..7100fd6bb 100644
--- a/src/Form.svelte
+++ b/src/Form.svelte
@@ -150,7 +150,7 @@
   }
 
   .description.invalid {
-    color: var(--color-negative) !important;
+    color: var(--color-negative);
   }
 
   .label {
@@ -248,7 +248,7 @@
         </span>
       {/if}
       {#if field.error}
-        <div class="description invalid txt-small faded">
+        <div class="description txt-faded txt-small invalid">
           {#if field.example}
             {field.error}, eg.
             <em>{field.example}</em>
@@ -257,7 +257,7 @@
           {/if}
         </div>
       {:else}
-        <div class="description txt-small faded">
+        <div class="description txt-faded txt-small">
           {@html marked(field.description)}
         </div>
       {/if}
diff --git a/src/RadicleUrn.svelte b/src/RadicleUrn.svelte
index 6acda1a5a..22f1f8c5b 100644
--- a/src/RadicleUrn.svelte
+++ b/src/RadicleUrn.svelte
@@ -36,7 +36,7 @@
 <div class="desktop">
   <div class="urn">
     <span class="icon">🌱</span>
-    <span class="faded">rad:git:</span>
+    <span class="txt-faded">rad:git:</span>
     <span>{parseRadicleId(urn)}</span>
   </div>
 </div>
diff --git a/src/SeedAddress.svelte b/src/SeedAddress.svelte
index 4c1c15ba6..5568e10ff 100644
--- a/src/SeedAddress.svelte
+++ b/src/SeedAddress.svelte
@@ -39,7 +39,7 @@
           {formatSeedId(seed.id)}@{seed.host}
         </a>
       </span>
-      <span class="faded">:{port}</span>
+      <span class="txt-faded">:{port}</span>
     {:else}
       <span>
         <a href="/seeds/{formatSeedHost(seed.host)}" class="link">
diff --git a/src/base/projects/Blob.svelte b/src/base/projects/Blob.svelte
index d5c4ef601..b2df4b38b 100644
--- a/src/base/projects/Blob.svelte
+++ b/src/base/projects/Blob.svelte
@@ -137,7 +137,7 @@
     <header>
       <div class="file-header">
         <span class="file-name">
-          <span class="faded">{parentDir}</span>
+          <span class="txt-faded">{parentDir}</span>
           &#8203;
           <span>{blob.info.name}</span>
         </span>