diff --git a/components/ShoutBox/messageformatter.tsx b/components/ShoutBox/messageformatter.tsx
index bfce342..aecfac5 100644
--- a/components/ShoutBox/messageformatter.tsx
+++ b/components/ShoutBox/messageformatter.tsx
@@ -33,7 +33,7 @@ const MessageFormatter = ({
     </div>
     {isAdmin && name !== 'Toimitus' && name !== 'Palvelin' && !telegram && (
       <button
-        className="m-1 inline-block cursor-pointer select-none rounded border-[1px] border-white bg-transparent px-3 py-1.5 text-center align-middle text-base font-bold text-radio-accent"
+        className="m-1 inline-block cursor-pointer select-none rounded border-[1px] border-white px-3 py-1.5 text-center align-middle text-base font-bold text-radio-accent"
         onClick={() => onBanClick(name)}
       >
         Bännää
diff --git a/components/ShoutBox/nameinput.tsx b/components/ShoutBox/nameinput.tsx
index 95560ea..f395036 100644
--- a/components/ShoutBox/nameinput.tsx
+++ b/components/ShoutBox/nameinput.tsx
@@ -27,7 +27,7 @@ const NameInput = ({ onSubmitName }: NameInputProps) => {
         onSubmitName(name);
         setName('');
       }}
-      className=" px[10px] flex h-full flex-row"
+      className=" px[10px] flex h-full flex-row bg-radio-bg"
     >
       <TextField
         label={''}
@@ -40,7 +40,7 @@ const NameInput = ({ onSubmitName }: NameInputProps) => {
         <button
           type="submit"
           value="Send"
-          className="sbSubmitButton inline-block cursor-pointer select-none rounded border-[3px] border-white bg-transparent px-3 py-1.5 text-center align-middle text-base font-bold text-white disabled:opacity-50"
+          className="sbSubmitButton inline-block cursor-pointer select-none rounded border-[3px] border-white bg-radio-bg px-3 py-1.5 text-center align-middle text-base font-bold text-white disabled:opacity-50"
           disabled={isButtonDisabled(name)}
         >
           OK
diff --git a/components/ShoutBox/shoutbox.tsx b/components/ShoutBox/shoutbox.tsx
index 3e44b17..b73027e 100644
--- a/components/ShoutBox/shoutbox.tsx
+++ b/components/ShoutBox/shoutbox.tsx
@@ -143,10 +143,10 @@ const Chat = ({ limit, isOpen }: ShoutBoxProps) => {
   }
 
   return (
-    <div className="mx-auto flex h-96 w-full max-w-6xl px-[25px] py-6 md:h-[38rem] ">
-      <div className="mx-auto my-0 h-auto w-full flex-wrap overflow-auto overflow-x-hidden shadow-md">
+    <div className="mx-auto flex h-96 w-full max-w-6xl px-[25px] py-6 md:h-[38rem]">
+      <div className="mx-auto my-0 h-auto w-full flex-wrap overflow-auto overflow-x-hidden bg-radio-bg shadow-md">
         <div
-          className="flex h-[81%] flex-col-reverse overflow-y-auto overflow-x-hidden px-0 py-2 text-white md:h-[85%]"
+          className="flex h-[81%] flex-col-reverse overflow-y-auto overflow-x-hidden px-0 py-2 text-white md:h-[85%] shadow-md"
           ref={messagesViewport}
         >
           {messages.map((message, index) => (
@@ -156,7 +156,7 @@ const Chat = ({ limit, isOpen }: ShoutBoxProps) => {
               name={message.name}
               timestamp={message.timestamp}
               color={
-                index % 2 === 0 ? 'bg-radio-common' : 'bg-radio-controller'
+                index % 2 === 0 ? 'bg-radio-bg' : 'bg-radio-bg200'
               }
               isAdmin={isAdmin}
               onBanClick={handleBanClick}
@@ -169,7 +169,7 @@ const Chat = ({ limit, isOpen }: ShoutBoxProps) => {
             </div>
           )}
         </div>
-        <div className="h-[4rem] w-full">
+        <div className="h-[4rem] w-full, bg-radio-bg">
           {name ? (
             <MessageInput
               name={isAdmin ? 'Toimitus' : name}
diff --git a/components/ShoutBox/textfield.tsx b/components/ShoutBox/textfield.tsx
index 60e7b74..cc932e5 100644
--- a/components/ShoutBox/textfield.tsx
+++ b/components/ShoutBox/textfield.tsx
@@ -18,7 +18,7 @@ const TextField = ({
   <div className="TextFieldArea mr-[16px] inline-flex w-full justify-around">
     {label}
     <input
-      className="TextField w-full rounded-none border-b-2 border-solid border-radio-controller bg-transparent text-white"
+      className="TextField w-full rounded-none border-b-2 border-solid border-radio-controller bg-radio-bg text-white"
       type={type || 'text'}
       placeholder={placeholder}
       value={value}