diff --git a/.changeset/hip-monkeys-notice.md b/.changeset/hip-monkeys-notice.md
new file mode 100644
index 00000000..1784d532
--- /dev/null
+++ b/.changeset/hip-monkeys-notice.md
@@ -0,0 +1,5 @@
+---
+'@giphy/react-components': patch
+---
+
+fix ssr hydration warning in styled component
diff --git a/packages/react-components/src/components/search-bar/search-button.tsx b/packages/react-components/src/components/search-bar/search-button.tsx
index 843bf49c..33798f81 100644
--- a/packages/react-components/src/components/search-bar/search-button.tsx
+++ b/packages/react-components/src/components/search-bar/search-button.tsx
@@ -121,11 +121,11 @@ const SearchButton = ({ onClick }: Props) => {
     const throttledFetch = useThrottle(isFetching, 1000)
     return (
         <Container onClick={() => onClick?.()}>
-            <GradientBox />
+            <GradientBox suppressHydrationWarning />
             <SearchIcon />
             {throttledFetch && (
-                <Fx>
-                    <Scanner />
+                <Fx suppressHydrationWarning>
+                    <Scanner suppressHydrationWarning />
                 </Fx>
             )}
         </Container>