diff --git a/pages/404.js b/pages/404.js
index 0288183..c3dcdba 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -14,7 +14,7 @@
 				name="404"
 				subtext="Not Found"
 				gradient={["6576CC", "4B5899"]}
-				wave="Main"
+				wave="web/waves/header/cmp"
 				buttons={[
 					{color: "6576CC", buttonText: "ffffff", text: "Go Home", link: "/#"},
 					{color: "6576CC", buttonText: "ffffff", text: "Send Error",
diff --git a/pages/500.js b/pages/500.js
index 3750165..20d66ca 100644
--- a/pages/500.js
+++ b/pages/500.js
@@ -14,7 +14,7 @@
 				name="500"
 				subtext="Internal Server Error"
 				gradient={["6576CC", "4B5899"]}
-				wave="Main"
+				wave="web/waves/header/cmp"
 				buttons={[
 					{color: "6576CC", buttonText: "ffffff", text: "Go Home", link: "/#"},
 					{color: "6576CC", buttonText: "ffffff", text: "Send Error",
diff --git a/pages/_app.js b/pages/_app.js
index 46808d0..5eee980 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -27,7 +27,7 @@
                 cardText: '#424242',
                 cardBackground: 'rgba(0, 0, 0, 0.65)',
                 cardBorder: '#424242',
-                cardFilter: 'brightness(0.7)',
+                cardFilter: 'brightness(0.5)',
                 cardOverlay: '#42424280',
                 hint: '#101010',
             }
diff --git a/pages/castaway.js b/pages/castaway.js
index 3aa7411..0df3063 100644
--- a/pages/castaway.js
+++ b/pages/castaway.js
@@ -15,7 +15,7 @@
         name="Castaway"
         subtext="Stranded on Discord"
         gradient={["71AFE5", "78ECF2"]}
-        wave="CA"
+        wave="web/waves/header/castaway"
         buttons={[
           {color: "78ECF2", buttonText: "000000", link: "#timeline", text: "Timeline"}
         ]}
diff --git a/pages/clicksforms.js b/pages/clicksforms.js
index 68bd3e3..19bc048 100644
--- a/pages/clicksforms.js
+++ b/pages/clicksforms.js
@@ -13,7 +13,7 @@
         name="ClicksForms"
         subtext="Custom forms on Discord"
         gradient={["71AFE5", "6576CC"]}
-        wave="CF"
+        wave="web/waves/header/clicksforms"
         buttons={[
           {color: "6576CC", buttonText: "FFFFFF", link: "#features", text: "Features"},
           {color: "6576CC", buttonText: "FFFFFF", link: "#commands", text: "Commands"},
@@ -34,21 +34,22 @@
             <img alt="Many question types"   src="/Features/ClicksForms/Types.svg" />
             <img alt="Easily view responses" src="/Features/ClicksForms/Responses.svg" />
           </TileRow>
-            <SectionHeading id="commands">Commands</SectionHeading>
-            <Paragraph><code>/accept</code>: Completes a form you are asked to fill in</Paragraph>
-            <Paragraph><code>/apply</code>: Apply to a form</Paragraph>
-            <Paragraph><code>/create</code>: Creates a new form</Paragraph>
-            <Paragraph><code>/download</code>: Downloads a form from a service e.g. Google Forms</Paragraph>
-            <Paragraph><code>/help</code>: Lists all commands</Paragraph>
-            <Paragraph><code>/responses</code>: Lets you view responses to your servers form</Paragraph>
-            <Paragraph><code>/manage</code>: Lets you manage your servers forms</Paragraph>
-            <SectionHeading id="services">Services</SectionHeading>
-            <Paragraph>ClicksForms support services like <a href="https://forms.google.com">Google Forms</a> through our Add-on</Paragraph>
-            <Paragraph>Our API is public. You can view it on <a href="https://clicksminuteper.github.io/docs/clicksforms">GitHub</a></Paragraph>
-            <SectionHeading id="invite">Invite</SectionHeading>
-            <CardRow>
-            <Card
-            wave="CF"
+          <SectionHeading id="commands">Commands</SectionHeading>
+          <Paragraph><code>/accept</code>: Completes a form you are asked to fill in</Paragraph>
+          <Paragraph><code>/apply</code>: Apply to a form</Paragraph>
+          <Paragraph><code>/create</code>: Creates a new form</Paragraph>
+          <Paragraph><code>/download</code>: Downloads a form from a service e.g. Google Forms</Paragraph>
+          <Paragraph><code>/help</code>: Lists all commands</Paragraph>
+          <Paragraph><code>/responses</code>: Lets you view responses to your servers form</Paragraph>
+          <Paragraph><code>/manage</code>: Lets you manage your servers forms</Paragraph>
+          <SectionHeading id="services">Services</SectionHeading>
+          <Paragraph>ClicksForms support services like <a href="https://forms.google.com">Google Forms</a> through our Add-on</Paragraph>
+          <Paragraph>Our API is public. You can view it on <a href="https://clicksminuteper.github.io/docs/clicksforms">GitHub</a></Paragraph>
+          <SectionHeading id="invite">Invite</SectionHeading>
+          <CardRow>
+          <Card
+            wave="clicksforms"
+            icon="bots/clicksforms/normal"
             buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
             title="Invite"
             subtext="Invite ClicksForms to your server"
@@ -56,7 +57,7 @@
               {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands", text: "Invite"}
             ]}
           />
-        </CardRow>
+          </CardRow>
         <SectionHeading>Legal</SectionHeading>
         <Paragraph>Our privacy policy can be viewed on <a href="https://clicksminuteper.net/clicksforms/privacy">GitHub</a></Paragraph>
       </AutoSpacing>
diff --git a/pages/clicksforms/form.js b/pages/clicksforms/form.js
index 8aa9f27..3912ca2 100644
--- a/pages/clicksforms/form.js
+++ b/pages/clicksforms/form.js
@@ -46,7 +46,7 @@
                     name={this.form.name}
                     subtext={this.form.description + (this.form.active ? '' : <><br />This form is not accepting responses. Please check back later</>)}
                     gradient={["71AFE5", "6576CC"]}
-                    wave="CF"
+                    wave="web/waves/header/clicksforms"
                     buttons={[]}
                 />
                 <div id="start" />
diff --git a/pages/gps.js b/pages/gps.js
index 178e68f..61dfea3 100644
--- a/pages/gps.js
+++ b/pages/gps.js
@@ -12,7 +12,7 @@
         name="GPS"
         subtext="Cards Against Humanity on Discord"
         gradient={["78ECF2", "71AFE5"]}
-        wave="GS"
+        wave="web/waves/header/gps"
         buttons={[
           {color: "71AFE5", buttonText: "FFFFFF", link: "#features", text: "Features"},
           {color: "71AFE5", buttonText: "FFFFFF", link: "#commands", text: "Commands"},
@@ -24,39 +24,39 @@
         <SectionHeading id="features">Features</SectionHeading>
         <CardRow>
           <Card
-            icon="GPS/players"
+            icon="web/icons/gps/players"
             title="Lots of friends?"
             subtext="You probably don't have 50 friends - But if you did, you can play with every one of them at the same time"
-            wave="GS"
+            wave="gps"
             gradient={["78ECF2", "71AFE5"]}
           />
           <Card
-            icon="GPS/cards"
+            icon="web/icons/gps/cards"
             title="2000+ cards"
             subtext="Enjoy games with over 2000 cards, written for you to insult others"
-            wave="CF"
+            wave="clicksforms"
             gradient={["71AFE5", "6576CC"]}
           />
           <Card
-            icon="GPS/customisation"
+            icon="web/icons/gps/customisation"
             title="Customisation."
             subtext="Customise every setting of your game and be as pedantic as you wish"
-            wave="HY"
+            wave="hooky"
             gradient={["424242", "8D8D8D"]}
           />
           <Card
-            icon="GPS/time"
+            icon="web/icons/gps/time"
             title="Patience is a virtue"
             subtext="But you don't have a lot of it - Your friends may be slow at picking cards, but you don't have to live with it"
-            wave="RM"
+            wave="rsm"
             gradient={["F27878", "D96B6B"]}
           />
           <Card
-            icon="GPS/shuffles"
+            icon="web/icons/gps/shuffles"
             title="Shuffles"
             subtext={`Replace your worst cards with new ones because \"The bot is unfair
             and always gives me the worst cards and everyone else is better at the game than me\"`}
-            wave="CL"
+            wave="clcks"
             gradient={["C4C4C4", "8D8D8D"]}
           />
         </CardRow>
@@ -77,7 +77,8 @@
         <SectionHeading id="invite">Invite</SectionHeading>
         <CardRow>
           <Card
-            wave="GS"
+            wave="gps"
+            icon="bots/gps/normal"
             buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
             title="Invite"
             subtext="Invite GPS to your server"
diff --git a/pages/hooky.js b/pages/hooky.js
index 4eb42f1..de401b9 100644
--- a/pages/hooky.js
+++ b/pages/hooky.js
@@ -15,7 +15,7 @@
         name="Hooky"
         subtext="Webhook protection for Discord"
         gradient={["424242", "8D8D8D"]}
-        wave="CA"
+        wave="web/waves/header/hooky"
         buttons={[
           {color: "EDC575", buttonText: "000000", link: "#invite", text: "Invite"}
         ]}
@@ -25,7 +25,8 @@
         <SectionHeading id="invite">Invite</SectionHeading>
         <CardRow>
           <Card
-            wave="HY"
+            wave="hooky"
+            icon="bots/hooky/normal"
             buttonText={"000000"} gradient={["424242", "8D8D8D"]}
             title="Invite"
             subtext="Invite Hooky to your server"
diff --git a/pages/index.js b/pages/index.js
index 884c384..de0228d 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -14,7 +14,7 @@
         name="Clicks Minute Per"
         subtext="Custom Made Programs"
         gradient={["6576CC", "4B5899"]}
-        wave="Main"
+        wave="web/waves/header/cmp"
         buttons={[]}
       />
       <p id="start" />
@@ -22,7 +22,8 @@
         <SectionHeading>Projects</SectionHeading>
         <CardRow>
           <Card
-            wave="GS" title="GPS" subtext="Cards Against Humanity on Discord"
+            wave="gps" title="GPS" subtext="Cards Against Humanity on Discord"
+            icon="bots/gps/normal"
             buttons={[
               {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"},
               {color: "6576CC", link: "/gps", text: "About"}
@@ -30,7 +31,8 @@
             buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
           />
           <Card
-            wave="RM" title="RSM" subtext="Moderation Redefined"
+            wave="rsm" title="RSM" subtext="Moderation Redefined"
+            icon="bots/rsm/normal"
             buttons={[
               {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands",text:"Invite"},
               {color: "424242", link: "/rsm", text:"About"}
@@ -38,7 +40,8 @@
             buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
           />
           <Card
-            wave="CF" title="ClicksForms" subtext="Create custom forms for Discord"
+            wave="clicksforms" title="ClicksForms" subtext="Create custom forms for Discord"
+            icon="bots/clicksforms/normal"
             buttons={[
               {color: "775EBF", link: "https://clicksminuteper.github.io/docs/clicksforms", text:"API", newTab: true},
               {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands",text:"Invite"},
@@ -47,14 +50,16 @@
             buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
           />
           <Card
-            wave="CA" title="Castaway" subtext="Stranded on Discord"
+            wave="castaway" title="Castaway" subtext="Stranded on Discord"
+            icon="bots/castaway/normal"
             buttons={[
               {color: "F2D478", link: "/castaway", text: "About"}
             ]}
             buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
           />
           <Card
-            wave="HY" title="Hooky" subtext="Webhook protection for Discord"
+            wave="hooky" title="Hooky" subtext="Webhook protection for Discord"
+            icon="bots/hooky/normal"
             buttons={[
               {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invite"},
               {color: "EDC575", link: "/hooky", text: "About"}
@@ -62,7 +67,8 @@
             buttonText={"000000"} gradient={["424242", "8D8D8D"]}
           />
           <Card
-            wave="CL" title="Clcks" subtext="Clicks Minute Per web apps"
+            wave="clcks" title="Clcks" subtext="Clicks Minute Per web apps"
+            icon="web/icons/clcks"
             buttons={[
               {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
             }]}
@@ -72,14 +78,16 @@
         <SectionHeading>Code Bases</SectionHeading>
         <CardRow>
           <Card
-            wave="GH" title="GitHub" subtext="View our open source projects"
+            wave="github" title="GitHub" subtext="View our open source projects"
+            icon="web/icons/github"
             buttons={[
               {color: "424242", link: "https://github.com/clicksminuteper", text: "Visit"}
             ]}
             buttonText={"FFFFFF"} gradient={["FFFFFF", "C4C4C4"]}
           />
           <Card
-            wave="PY" title="PyPi" subtext="View our modules for python"
+            wave="pypi" title="PyPi" subtext="View our modules for python"
+            icon="web/icons/pypi"
             buttons={[
               {color: "FFC91E", link: "https://pypi.org/user/ClicksMinutePer/", text: "Visit"}
             ]}
@@ -89,9 +97,10 @@
         <SectionHeading>Socials</SectionHeading>
         <CardRow>
           <Card
-            wave="DS" title="Discord" subtext="Join our Discord server to talk with the community"
+            wave="discord" title="Discord" subtext="Join our Discord server to talk with the community"
+            icon="web/icons/discord"
             buttons={[
-              {color: "424242", link: "https://discord.gg/bPaNnxe", text: "Join"}
+              {color: "404EED", link: "https://discord.gg/bPaNnxe", text: "Join"}
             ]}
             buttonText={"FFFFFF"} gradient={["404EED", "404EED"]}
           />
diff --git a/pages/rsm.js b/pages/rsm.js
index 4c087ce..6038029 100644
--- a/pages/rsm.js
+++ b/pages/rsm.js
@@ -25,7 +25,7 @@
         name="RSM"
         subtext="Moderation Redefined"
         gradient={["F27878", "D96B6B"]}
-        wave="RM"
+        wave="web/waves/header/rsm"
         buttons={[
           {color: "424242", buttonText: "FFFFFF", link: "#features", text: "Features"},
           {color: "424242", buttonText: "FFFFFF", link: "#commands", text: "Commands"},
@@ -88,14 +88,15 @@
         <Paragraph><code>m!unlock</code>: Unlocks the channel. Slowmode is removed and messages can be sent.</Paragraph>
         <SectionHeading id="invite">Invite</SectionHeading>
         <CardRow>
-        <Card
-      wave="RM"
-      buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
-      title="Invite"
-      subtext="Invite RSM to your server"
-      buttons={[
-          {color: "F27878", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands", text: "Invite"}
-      ]}
+          <Card
+            wave="rsm"
+            icon="bots/rsm/normal"
+            buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
+            title="Invite"
+            subtext="Invite RSM to your server"
+            buttons={[
+                {color: "F27878", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands", text: "Invite"}
+            ]}
           />
         </CardRow>
       </AutoSpacing>
diff --git a/pages/rsmv/failure.js b/pages/rsmv/failure.js
index caca7c5..3a3085c 100644
--- a/pages/rsmv/failure.js
+++ b/pages/rsmv/failure.js
@@ -12,7 +12,7 @@
                 name="Verification failed"
                 subtext={<p>Please try again, and if the error persists please contact us at <a href="mailto:verification@clicksminuteper.net" target="_blank" rel="noopener noreferrer">verification@clicksminuteper.net</a></p>}
                 gradient={["F27878", "D96B6B"]}
-                wave="RM"
+                wave="web/waves/header/rsm"
                 buttons={[]}
                 hideArrow={true}
             />
diff --git a/pages/rsmv/index.js b/pages/rsmv/index.js
index 231894c..62f49b5 100644
--- a/pages/rsmv/index.js
+++ b/pages/rsmv/index.js
@@ -67,7 +67,7 @@
                 nameOverwrite="Verify"
                 subtext={` ${this.props.memberCount} members`}
                 gradient={["F27878", "D96B6B"]}
-                wave="RM"
+                wave="web/waves/header/rsm"
                 buttons={[]}
             />
             <div id="start">
diff --git a/pages/rsmv/success.js b/pages/rsmv/success.js
index a1ed945..1d845af 100644
--- a/pages/rsmv/success.js
+++ b/pages/rsmv/success.js
@@ -13,7 +13,7 @@
                 name="Verified"
                 subtext="You can now close this tab or window."
                 gradient={["65CC76", "60B258"]}
-                wave="RM"
+                wave="web/waves/header/rsm"
                 buttons={[]}
                 hideArrow={true}
             />
diff --git a/pages/support.js b/pages/support.js
index 885c2fd..9cf5814 100644
--- a/pages/support.js
+++ b/pages/support.js
@@ -12,7 +12,7 @@
         name="Support"
         subtext="Get support for ClicksMinutePer products"
         gradient={["71AFE5", "6576CC"]}
-        wave="CF"
+        wave="web/waves/header/clicksforms"
         buttons={[]}
       />
       <AutoSpacing>