fix image quality

app/components/explore/PageHeader.tsx

@@ -24,8 +24,8 @@ const PageHeader = ({
   const imageSrc = backgroundImageUrl
     ? backgroundImageUrl
     : theme === 'Dark'
-      ? '/images/new/cube-bg.webp'
-      : '/images/new/cube-bg-light.webp'
+      ? '/images/new/cube-bg.png'
+      : '/images/new/cube-bg-light.png'
 
   useEffect(() => {
     setMounted(true)

app/components/explore/token-page/KeyValuePairDisplay.tsx

@@ -1,3 +1,4 @@
+'use client'
 import { ReactNode } from 'react'
 import Tooltip from '../../shared/Tooltip'
 

app/components/explore/token-page/TokenMangoStats.tsx

@@ -1,5 +1,3 @@
-'use client'
-
 import Link from 'next/link'
 import { TokenPageWithData } from '../../../../contentful/tokenPage'
 import {

app/components/home/Wrappers.tsx

@@ -46,8 +46,8 @@ export const BuildWrapper = forwardRef<HTMLDivElement, RefWrapperProps>(
       <div
         className={`${
           theme === 'Dark'
-            ? `bg-[url('/images/new/cube-bg.webp')]`
-            : `bg-[url('/images/new/cube-bg-light.webp')]`
+            ? `bg-[url('/images/new/cube-bg.png')]`
+            : `bg-[url('/images/new/cube-bg-light.png')]`
         } bg-repeat`}
         ref={ref}
       >