diff --git a/src/components/Category/Category.css b/src/components/Category/Category.css
deleted file mode 100644
index 99a8091..0000000
--- a/src/components/Category/Category.css
+++ /dev/null
@@ -1,2 +0,0 @@
-
-
diff --git a/src/components/Category/index.js b/src/components/Category/index.js
index 07ba4ed..2ba69cd 100644
--- a/src/components/Category/index.js
+++ b/src/components/Category/index.js
@@ -6,7 +6,6 @@ import {
   CategoryLink,
   CategoryList,
 } from "./styles";
-import "./Category.css";
 
 export default function Category({ name, options = [] }) {
   return (
diff --git a/src/components/Fav/index.js b/src/components/Fav/index.js
index 4c4ae89..d29030e 100644
--- a/src/components/Fav/index.js
+++ b/src/components/Fav/index.js
@@ -4,7 +4,7 @@ import Modal from "components/Modal";
 import Login from "components/Login";
 import { useLocation } from "wouter";
 
-import "./Fav.css";
+import { GifFav, GifFavIcon } from "./styles";
 
 export default function Fav({ id }) {
   const { isLogged, addFav, favs } = useUser();
@@ -32,11 +32,11 @@ export default function Fav({ id }) {
 
   return (
     <>
-      <button className="gf-Fav" onClick={handleClick}>
-        <span aria-label={label} role="img">
+      <GifFav className="gf-Fav" onClick={handleClick}>
+        <GifFavIcon aria-label={label} role="img">
           {emoji}
-        </span>
-      </button>
+        </GifFavIcon>
+      </GifFav>
       {showModal && (
         <Modal onClose={handleClose}>
           <Login onLogin={handleLogin} />
diff --git a/src/components/Fav/Fav.css b/src/components/Fav/styles.js
similarity index 51%
rename from src/components/Fav/Fav.css
rename to src/components/Fav/styles.js
index dcd7930..81de84e 100644
--- a/src/components/Fav/Fav.css
+++ b/src/components/Fav/styles.js
@@ -1,4 +1,6 @@
-.gf-Fav {
+import styled from "@emotion/styled";
+
+export const GifFav = styled.button`
   background: rgba(255, 172, 172, .3);
   border: 0;
   border-radius: 100px;
@@ -6,13 +8,13 @@
   width: 30px;
   height: 30px;
   transition: all .3s ease;
-}
 
-.gf-Fav:hover {
-  background: rgba(255, 172, 172, .8);
-}
+  :hover{
+    background: rgba(255, 172, 172, .8);
+  } 
+`
 
-.gf-Fav span {
+export const GifFavIcon = styled.span`
   display: block;
   width: 20px;
-}
\ No newline at end of file
+`