diff --git a/src/app/about/sections/about-me.tsx b/src/app/about/sections/about-me.tsx
index 6c09b353..4b9ff4cf 100644
--- a/src/app/about/sections/about-me.tsx
+++ b/src/app/about/sections/about-me.tsx
@@ -28,7 +28,7 @@ export function AboutMe() {
             target="_blank"
             href="/assets/cv-mateus-felipe.pdf"
           >
-            Download CV <DownloadSimple />
+            Download CV <DownloadSimple size="1em" />
           </a>
         </div>
       </div>
diff --git a/src/app/about/sections/contact.tsx b/src/app/about/sections/contact.tsx
index a085dd65..a07d8e05 100644
--- a/src/app/about/sections/contact.tsx
+++ b/src/app/about/sections/contact.tsx
@@ -16,49 +16,49 @@ export function Contact() {
       <div className="flex-1">
         <div className="contact-line contact-line-title">
           <span className="rounded bg-neutral-900 bg-opacity-10 p-1 dark:bg-neutral-100 dark:bg-opacity-10">
-            <Envelope weight="duotone" />
+            <Envelope size="1em" weight="duotone" />
           </span>
           <span>Email</span>
         </div>
         <div className="contact-line contact-line-title text-[#181717] dark:text-[#E6EDF3]">
           <span className="rounded bg-[#181717] bg-opacity-10 p-1 dark:bg-[#E6EDF3] dark:bg-opacity-10">
-            <GithubLogo weight="duotone" />
+            <GithubLogo size="1em" weight="duotone" />
           </span>
           <span>Github</span>
         </div>
         <div className="contact-line contact-line-title text-[#0A66C2]">
           <span className="rounded bg-[#0A66C2] bg-opacity-10 p-1 ">
-            <LinkedinLogo weight="duotone" />
+            <LinkedinLogo size="1em" weight="duotone" />
           </span>
           <span>Linkedin</span>
         </div>
         <div className="contact-line contact-line-title text-[#F58025]">
           <span className="rounded bg-[#F58025] bg-opacity-10 p-1">
-            <StackOverflowLogo weight="duotone" />
+            <StackOverflowLogo size="1em" weight="duotone" />
           </span>
           <span>Stack Overflow</span>
         </div>
         <div className="contact-line contact-line-title text-[#181717] dark:text-[#E6EDF3]">
           <span className="rounded bg-[#181717] bg-opacity-10 p-1 dark:bg-[#E6EDF3] dark:bg-opacity-10">
-            <CodepenLogo weight="duotone" />
+            <CodepenLogo size="1em" weight="duotone" />
           </span>
           <span>Codepen</span>
         </div>
         <div className="contact-line contact-line-title text-[#FF4500]">
           <span className="rounded bg-[#FF4500] bg-opacity-10 p-1">
-            <RedditLogo weight="duotone" />
+            <RedditLogo size="1em" weight="duotone" />
           </span>
           <span>Reddit</span>
         </div>
         <div className="contact-line contact-line-title text-[#1D9BF0]">
           <span className="rounded bg-[#1D9BF0] bg-opacity-10 p-1">
-            <TwitterLogo weight="duotone" />
+            <TwitterLogo size="1em" weight="duotone" />
           </span>
           <span>Twitter</span>
         </div>
         <div className="contact-line contact-line-title text-[#E4405F]">
           <span className="rounded bg-[#E4405F] bg-opacity-10 p-1">
-            <InstagramLogo weight="duotone" />
+            <InstagramLogo size="1em" weight="duotone" />
           </span>
           <span>Instagram</span>
         </div>
@@ -82,7 +82,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">Send e-mail</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -93,7 +93,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">Open profile</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -104,7 +104,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">Open profile</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -115,7 +115,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">Open summary</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -126,7 +126,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">View pens</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -137,7 +137,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">See comments</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -148,7 +148,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">See tweets</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
         <div className="contact-line">
@@ -159,7 +159,7 @@ export function Contact() {
             rel="external"
           >
             <span className="leading-none">Open profile</span>
-            <ArrowUpRight className="text-sm" />
+            <ArrowUpRight size="1em" className="text-sm" />
           </a>
         </div>
       </div>
diff --git a/src/app/about/sections/knowledge/accordion.tsx b/src/app/about/sections/knowledge/accordion.tsx
index 51ebcb24..67862f9e 100644
--- a/src/app/about/sections/knowledge/accordion.tsx
+++ b/src/app/about/sections/knowledge/accordion.tsx
@@ -39,6 +39,7 @@ export const AccordionTrigger = React.forwardRef(
       >
         {children}
         <CaretDown
+          size="1em"
           className="transition-transform duration-300 ease-[cubic-bezier(0.87,_0,_0.13,_1)] group-data-[state=open]:rotate-180"
           aria-hidden
         />
diff --git a/src/app/about/sections/knowledge/index.tsx b/src/app/about/sections/knowledge/index.tsx
index 475f34ed..5ca9817c 100644
--- a/src/app/about/sections/knowledge/index.tsx
+++ b/src/app/about/sections/knowledge/index.tsx
@@ -23,7 +23,7 @@ export function Knowledge() {
         <AccordionItem value="Skill captions">
           <AccordionTrigger>
             <span className="flex items-center gap-3">
-              <ClosedCaptioning />
+              <ClosedCaptioning size="1em" />
               <span>Skill captions</span>
             </span>
           </AccordionTrigger>
diff --git a/src/app/about/sections/statistics/cards/github-followers.tsx b/src/app/about/sections/statistics/cards/github-followers.tsx
index 466cc02d..535d632b 100644
--- a/src/app/about/sections/statistics/cards/github-followers.tsx
+++ b/src/app/about/sections/statistics/cards/github-followers.tsx
@@ -17,7 +17,7 @@ export async function GithubFollowers() {
     <>
       <Card
         title="Github Followers"
-        icon={<GithubLogo weight="duotone" />}
+        icon={<GithubLogo size="1em" weight="duotone" />}
         content={
           <div className="flex items-center gap-2">
             <div className="flex flex-row-reverse justify-end">
diff --git a/src/app/about/sections/statistics/cards/github-stars.tsx b/src/app/about/sections/statistics/cards/github-stars.tsx
index e84f10e3..892f02c9 100644
--- a/src/app/about/sections/statistics/cards/github-stars.tsx
+++ b/src/app/about/sections/statistics/cards/github-stars.tsx
@@ -12,7 +12,7 @@ export async function GithubStars() {
   return (
     <Card
       title="Github Stars"
-      icon={<GithubLogo weight="duotone" />}
+      icon={<GithubLogo size="1em" weight="duotone" />}
       content={String(stars)}
     />
   )
diff --git a/src/app/about/sections/statistics/cards/last-track.tsx b/src/app/about/sections/statistics/cards/last-track.tsx
index 49861cb3..e822a976 100644
--- a/src/app/about/sections/statistics/cards/last-track.tsx
+++ b/src/app/about/sections/statistics/cards/last-track.tsx
@@ -13,7 +13,7 @@ export async function LastTrack() {
   return (
     <Card
       title="Last Played"
-      icon={<SpotifyLogo weight="duotone" />}
+      icon={<SpotifyLogo size="1em" weight="duotone" />}
       content={
         <a
           href={lastTrack.url}
diff --git a/src/app/about/sections/statistics/cards/spotify-plays.tsx b/src/app/about/sections/statistics/cards/spotify-plays.tsx
index 1ba31923..0f82d6c2 100644
--- a/src/app/about/sections/statistics/cards/spotify-plays.tsx
+++ b/src/app/about/sections/statistics/cards/spotify-plays.tsx
@@ -9,7 +9,7 @@ export async function SpotifyPlays() {
   return (
     <Card
       title="Spotify Plays"
-      icon={<SpotifyLogo weight="duotone" />}
+      icon={<SpotifyLogo size="1em" weight="duotone" />}
       content={playcount}
     />
   )
diff --git a/src/app/about/sections/statistics/cards/top-artist.tsx b/src/app/about/sections/statistics/cards/top-artist.tsx
index 21e33de6..1ee54a5f 100644
--- a/src/app/about/sections/statistics/cards/top-artist.tsx
+++ b/src/app/about/sections/statistics/cards/top-artist.tsx
@@ -10,7 +10,7 @@ export async function TopArtist() {
   return (
     <Card
       title="Top Artist"
-      icon={<SpotifyLogo weight="duotone" />}
+      icon={<SpotifyLogo size="1em" weight="duotone" />}
       content={
         <a
           href={mostListened.url}
diff --git a/src/app/about/sections/statistics/index.tsx b/src/app/about/sections/statistics/index.tsx
index 53e5ccde..2d3a33f6 100644
--- a/src/app/about/sections/statistics/index.tsx
+++ b/src/app/about/sections/statistics/index.tsx
@@ -31,7 +31,7 @@ export function StatisticsGrid() {
               className="inline-flex items-end leading-none text-neutral-500 transition-colors hover:text-black dark:text-neutral-600 dark:hover:text-white"
             >
               <span>See more</span>
-              <ArrowUpRight className="text-xs" />
+              <ArrowUpRight size="1em" className="text-xs" />
             </Link>
           </div>
         </div>
diff --git a/src/app/about/statistics/components/github-dashboard/cards/commits.tsx b/src/app/about/statistics/components/github-dashboard/cards/commits.tsx
index a22c07f3..260a2718 100644
--- a/src/app/about/statistics/components/github-dashboard/cards/commits.tsx
+++ b/src/app/about/statistics/components/github-dashboard/cards/commits.tsx
@@ -8,7 +8,7 @@ export async function Commits() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Commits</span>
-        <GitCommit weight="duotone" />
+        <GitCommit size="1em" weight="duotone" />
       </span>
       <div className="flex h-full items-center text-2xl">{total_count}</div>
     </div>
diff --git a/src/app/about/statistics/components/github-dashboard/cards/followers.tsx b/src/app/about/statistics/components/github-dashboard/cards/followers.tsx
index aa9468d6..50a8e6ef 100644
--- a/src/app/about/statistics/components/github-dashboard/cards/followers.tsx
+++ b/src/app/about/statistics/components/github-dashboard/cards/followers.tsx
@@ -17,7 +17,7 @@ export async function Followers() {
     <div className="flex h-full w-full flex-col justify-between gap-2 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Followers</span>
-        <Heart weight="duotone" />
+        <Heart size="1em" weight="duotone" />
       </span>
       <span className="text-xl">
         <div className="grid grid-cols-12 gap-1">
diff --git a/src/app/about/statistics/components/github-dashboard/cards/graph.tsx b/src/app/about/statistics/components/github-dashboard/cards/graph.tsx
index c3031e4c..cf0a59ec 100644
--- a/src/app/about/statistics/components/github-dashboard/cards/graph.tsx
+++ b/src/app/about/statistics/components/github-dashboard/cards/graph.tsx
@@ -7,7 +7,7 @@ export function Graph() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Contribution Graph</span>
-        <CalendarBlank weight="duotone" />
+        <CalendarBlank size="1em" weight="duotone" />
       </span>
       <div className="flex items-center">
         <Image
diff --git a/src/app/about/statistics/components/github-dashboard/cards/languages.tsx b/src/app/about/statistics/components/github-dashboard/cards/languages.tsx
index 3cbf6020..48031961 100644
--- a/src/app/about/statistics/components/github-dashboard/cards/languages.tsx
+++ b/src/app/about/statistics/components/github-dashboard/cards/languages.tsx
@@ -14,7 +14,7 @@ export async function Languages() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Languages</span>
-        <Code weight="duotone" />
+        <Code size="1em" weight="duotone" />
       </span>
       <div className="flex h-full items-center text-2xl">{languagesLength}</div>
     </div>
diff --git a/src/app/about/statistics/components/github-dashboard/cards/repos.tsx b/src/app/about/statistics/components/github-dashboard/cards/repos.tsx
index 3b67db43..9def8bdc 100644
--- a/src/app/about/statistics/components/github-dashboard/cards/repos.tsx
+++ b/src/app/about/statistics/components/github-dashboard/cards/repos.tsx
@@ -8,7 +8,7 @@ export async function Repos() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Repositories</span>
-        <Cube weight="duotone" />
+        <Cube size="1em" weight="duotone" />
       </span>
       <div className="flex h-full items-center text-2xl">{public_repos}</div>
     </div>
diff --git a/src/app/about/statistics/components/github-dashboard/cards/stars.tsx b/src/app/about/statistics/components/github-dashboard/cards/stars.tsx
index 1793a113..1737cdb7 100644
--- a/src/app/about/statistics/components/github-dashboard/cards/stars.tsx
+++ b/src/app/about/statistics/components/github-dashboard/cards/stars.tsx
@@ -11,7 +11,7 @@ export async function Stars() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Stars</span>
-        <Star weight="duotone" />
+        <Star size="1em" weight="duotone" />
       </span>
       <div className="flex h-full items-center text-2xl">{stars}</div>
     </div>
diff --git a/src/app/about/statistics/components/github-dashboard/skeleton/commits.tsx b/src/app/about/statistics/components/github-dashboard/skeleton/commits.tsx
index 33876cac..392da771 100644
--- a/src/app/about/statistics/components/github-dashboard/skeleton/commits.tsx
+++ b/src/app/about/statistics/components/github-dashboard/skeleton/commits.tsx
@@ -4,7 +4,7 @@ export const CommitsSkeleton = () => (
   <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
     <span className="inline-flex items-center gap-2 text-neutral-600">
       <span>Repositories</span>
-      <GitCommit weight="duotone" />
+      <GitCommit size="1em" weight="duotone" />
     </span>
     <div className="h-7 w-1/2 animate-pulse rounded-3xl bg-neutral-400 dark:bg-neutral-800" />
   </div>
diff --git a/src/app/about/statistics/components/github-dashboard/skeleton/follower.tsx b/src/app/about/statistics/components/github-dashboard/skeleton/follower.tsx
index c1ddceab..acb99cd3 100644
--- a/src/app/about/statistics/components/github-dashboard/skeleton/follower.tsx
+++ b/src/app/about/statistics/components/github-dashboard/skeleton/follower.tsx
@@ -5,7 +5,7 @@ export const FollowersSkeleton = () => {
     <div className="flex h-full w-full flex-col justify-between gap-2 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Followers</span>
-        <Heart weight="duotone" />
+        <Heart size="1em" weight="duotone" />
       </span>
       <span className="text-xl">
         <div className="grid grid-cols-12 gap-1">
diff --git a/src/app/about/statistics/components/github-dashboard/skeleton/graph.tsx b/src/app/about/statistics/components/github-dashboard/skeleton/graph.tsx
index ea353566..2907a8fa 100644
--- a/src/app/about/statistics/components/github-dashboard/skeleton/graph.tsx
+++ b/src/app/about/statistics/components/github-dashboard/skeleton/graph.tsx
@@ -7,7 +7,7 @@ export function GraphSkeleton() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Contribution Graph</span>
-        <CalendarBlank weight="duotone" />
+        <CalendarBlank size="1em" weight="duotone" />
       </span>
       <div className="flex items-center">
         <div className="h-20 w-full animate-pulse rounded-3xl bg-neutral-400 dark:bg-neutral-800" />
diff --git a/src/app/about/statistics/components/github-dashboard/skeleton/languages.tsx b/src/app/about/statistics/components/github-dashboard/skeleton/languages.tsx
index d81d16a3..6980ebbd 100644
--- a/src/app/about/statistics/components/github-dashboard/skeleton/languages.tsx
+++ b/src/app/about/statistics/components/github-dashboard/skeleton/languages.tsx
@@ -4,7 +4,7 @@ export const LanguagesSkeleton = () => (
   <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
     <span className="inline-flex items-center gap-2 text-neutral-600">
       <span>Languages</span>
-      <Code weight="duotone" />
+      <Code size="1em" weight="duotone" />
     </span>
     <div className="h-7 w-1/2 animate-pulse rounded-3xl bg-neutral-400 dark:bg-neutral-800" />
   </div>
diff --git a/src/app/about/statistics/components/github-dashboard/skeleton/repos.tsx b/src/app/about/statistics/components/github-dashboard/skeleton/repos.tsx
index 1c8f5ec6..499d23fc 100644
--- a/src/app/about/statistics/components/github-dashboard/skeleton/repos.tsx
+++ b/src/app/about/statistics/components/github-dashboard/skeleton/repos.tsx
@@ -4,7 +4,7 @@ export const ReposSkeleton = () => (
   <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
     <span className="inline-flex items-center gap-2 text-neutral-600">
       <span>Repositories</span>
-      <Cube weight="duotone" />
+      <Cube size="1em" weight="duotone" />
     </span>
     <div className="h-7 w-1/2 animate-pulse rounded-3xl bg-neutral-400 dark:bg-neutral-800" />
   </div>
diff --git a/src/app/about/statistics/components/github-dashboard/skeleton/stars.tsx b/src/app/about/statistics/components/github-dashboard/skeleton/stars.tsx
index f76e3b65..e43789fe 100644
--- a/src/app/about/statistics/components/github-dashboard/skeleton/stars.tsx
+++ b/src/app/about/statistics/components/github-dashboard/skeleton/stars.tsx
@@ -4,7 +4,7 @@ export const StarsSkeleton = () => (
   <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
     <span className="inline-flex items-center gap-2 text-neutral-600">
       <span>Stars</span>
-      <Star weight="duotone" />
+      <Star size="1em" weight="duotone" />
     </span>
     <div className="h-7 w-1/2 animate-pulse rounded-3xl bg-neutral-400 dark:bg-neutral-800" />
   </div>
diff --git a/src/app/about/statistics/components/spotify-dashboard/cards/last-track.tsx b/src/app/about/statistics/components/spotify-dashboard/cards/last-track.tsx
index c9e61544..81d0170f 100644
--- a/src/app/about/statistics/components/spotify-dashboard/cards/last-track.tsx
+++ b/src/app/about/statistics/components/spotify-dashboard/cards/last-track.tsx
@@ -1,5 +1,4 @@
 import Image from 'next/image'
-
 import { MusicNotes } from '@phosphor-icons/react/dist/ssr'
 
 import { placeholder } from '@/shared/lib/placeholder'
@@ -15,7 +14,7 @@ export async function LastTrack() {
       <div className="flex h-full flex-1 flex-col overflow-hidden">
         <span className="inline-flex items-center gap-2 text-neutral-600">
           <span>Last Played</span>
-          <MusicNotes weight="duotone" />
+          <MusicNotes size="1em" weight="duotone" />
         </span>
         <span className="flex h-full items-center">
           <a
diff --git a/src/app/about/statistics/components/spotify-dashboard/cards/top-artists.tsx b/src/app/about/statistics/components/spotify-dashboard/cards/top-artists.tsx
index 3c152584..d72f91cc 100644
--- a/src/app/about/statistics/components/spotify-dashboard/cards/top-artists.tsx
+++ b/src/app/about/statistics/components/spotify-dashboard/cards/top-artists.tsx
@@ -23,7 +23,7 @@ export async function TopArtists() {
       <div className="flex flex-col leading-tight">
         <span className="inline-flex items-center gap-2 text-neutral-600">
           <span>Top Artists</span>
-          <UserList weight="duotone" />
+          <UserList size="1em" weight="duotone" />
         </span>
         <span className="text-xs text-neutral-500 dark:text-neutral-700">
           From last 6 months
diff --git a/src/app/about/statistics/components/spotify-dashboard/cards/top-tracks.tsx b/src/app/about/statistics/components/spotify-dashboard/cards/top-tracks.tsx
index 9d7b1fd3..a9b790c9 100644
--- a/src/app/about/statistics/components/spotify-dashboard/cards/top-tracks.tsx
+++ b/src/app/about/statistics/components/spotify-dashboard/cards/top-tracks.tsx
@@ -32,7 +32,7 @@ export async function TopTracks() {
       <div className="flex flex-col leading-tight">
         <span className="inline-flex items-center gap-2 text-neutral-600">
           <span>Top Tracks</span>
-          <Playlist weight="duotone" />
+          <Playlist size="1em" weight="duotone" />
         </span>
         <span className="text-xs text-neutral-500 dark:text-neutral-700">
           From last 6 months
diff --git a/src/app/about/statistics/components/spotify-dashboard/skeleton/last-track-skeleton.tsx b/src/app/about/statistics/components/spotify-dashboard/skeleton/last-track-skeleton.tsx
index 1949c85f..c0468aae 100644
--- a/src/app/about/statistics/components/spotify-dashboard/skeleton/last-track-skeleton.tsx
+++ b/src/app/about/statistics/components/spotify-dashboard/skeleton/last-track-skeleton.tsx
@@ -6,7 +6,7 @@ export function LastTrackSkeleton() {
       <div className="flex h-full w-full flex-col gap-1">
         <span className="inline-flex items-center gap-2 text-neutral-600">
           <span>Last Played</span>
-          <MusicNotes weight="duotone" />
+          <MusicNotes size="1em" weight="duotone" />
         </span>
 
         <div className="flex h-full items-center">
diff --git a/src/app/about/statistics/components/spotify-dashboard/skeleton/top-artists.skeleton.tsx b/src/app/about/statistics/components/spotify-dashboard/skeleton/top-artists.skeleton.tsx
index 7138109e..5d84c372 100644
--- a/src/app/about/statistics/components/spotify-dashboard/skeleton/top-artists.skeleton.tsx
+++ b/src/app/about/statistics/components/spotify-dashboard/skeleton/top-artists.skeleton.tsx
@@ -6,7 +6,7 @@ export function TopArtistsSkeleton() {
       <div className="flex flex-col leading-tight">
         <span className="inline-flex items-center gap-2 text-neutral-600">
           <span>Top Artists</span>
-          <UserList weight="duotone" />
+          <UserList size="1em" weight="duotone" />
         </span>
         <span className="text-xs text-neutral-500 dark:text-neutral-700">
           From last 3 months
diff --git a/src/app/about/statistics/components/spotify-dashboard/skeleton/top-tracks-skeleton.tsx b/src/app/about/statistics/components/spotify-dashboard/skeleton/top-tracks-skeleton.tsx
index 5908f8ac..37f63f6b 100644
--- a/src/app/about/statistics/components/spotify-dashboard/skeleton/top-tracks-skeleton.tsx
+++ b/src/app/about/statistics/components/spotify-dashboard/skeleton/top-tracks-skeleton.tsx
@@ -6,7 +6,7 @@ export function TopTracksSkeleton() {
       <div className="flex flex-col leading-tight">
         <span className="inline-flex items-center gap-2 text-neutral-600">
           <span>Top Tracks</span>
-          <Playlist weight="duotone" />
+          <Playlist size="1em" weight="duotone" />
         </span>
         <span className="text-xs text-neutral-500 dark:text-neutral-700">
           From last 3 months
diff --git a/src/app/about/statistics/components/writing-dashboard/cards/most-used-category.tsx b/src/app/about/statistics/components/writing-dashboard/cards/most-used-category.tsx
index c3508fdc..99a47e33 100644
--- a/src/app/about/statistics/components/writing-dashboard/cards/most-used-category.tsx
+++ b/src/app/about/statistics/components/writing-dashboard/cards/most-used-category.tsx
@@ -16,7 +16,7 @@ type RowProps = {
 const Row = ({ Icon, quantity, title }: RowProps) => (
   <div className="flex w-full items-center justify-between gap-3">
     <div className="flex items-center gap-3">
-      <Icon />
+      <Icon size="1em" />
       <span>{title}</span>
     </div>
     <span>{quantity}</span>
@@ -55,7 +55,7 @@ export async function MostUsedCategories() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Most Used Categories</span>
-        <FolderOpen weight="duotone" />
+        <FolderOpen size="1em" weight="duotone" />
       </span>
       <div className="flex h-full flex-col justify-around gap-2 text-2xl">
         {categories.map(category => (
diff --git a/src/app/about/statistics/components/writing-dashboard/cards/posts.tsx b/src/app/about/statistics/components/writing-dashboard/cards/posts.tsx
index 16a1235c..c18f3164 100644
--- a/src/app/about/statistics/components/writing-dashboard/cards/posts.tsx
+++ b/src/app/about/statistics/components/writing-dashboard/cards/posts.tsx
@@ -6,7 +6,7 @@ export async function Posts() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Posts</span>
-        <Article weight="duotone" />
+        <Article size="1em" weight="duotone" />
       </span>
       <div className="flex h-full items-center text-2xl">{allPosts.length}</div>
     </div>
diff --git a/src/app/about/statistics/components/writing-dashboard/cards/tag-cloud.tsx b/src/app/about/statistics/components/writing-dashboard/cards/tag-cloud.tsx
index a0d1c6cb..0d10a952 100644
--- a/src/app/about/statistics/components/writing-dashboard/cards/tag-cloud.tsx
+++ b/src/app/about/statistics/components/writing-dashboard/cards/tag-cloud.tsx
@@ -34,7 +34,7 @@ export async function TagCloud() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>Most Used Tags</span>
-        <Tag weight="duotone" />
+        <Tag size="1em" weight="duotone" />
       </span>
       <div className="flex h-full flex-wrap gap-1 leading-none">
         {tags.map(tag => (
diff --git a/src/app/about/statistics/components/writing-dashboard/cards/tils.tsx b/src/app/about/statistics/components/writing-dashboard/cards/tils.tsx
index 2d244c44..540d7cc2 100644
--- a/src/app/about/statistics/components/writing-dashboard/cards/tils.tsx
+++ b/src/app/about/statistics/components/writing-dashboard/cards/tils.tsx
@@ -6,7 +6,7 @@ export async function TILs() {
     <div className="flex h-full w-full flex-col justify-center gap-3 rounded-3xl bg-neutral-200 p-4 leading-none dark:bg-neutral-950 md:p-7">
       <span className="inline-flex items-center gap-2 text-neutral-600">
         <span>TILs</span>
-        <Notebook weight="duotone" />
+        <Notebook size="1em" weight="duotone" />
       </span>
       <div className="flex h-full items-center text-2xl">{allTILs.length}</div>
     </div>
diff --git a/src/app/about/statistics/page.tsx b/src/app/about/statistics/page.tsx
index 3c365831..44a260e0 100644
--- a/src/app/about/statistics/page.tsx
+++ b/src/app/about/statistics/page.tsx
@@ -29,21 +29,21 @@ export default function Page() {
       <div className="space-y-5">
         <div className="flex w-full items-center justify-center gap-2 text-3xl font-semibold text-[#333] dark:text-[#f5f5f5] md:justify-start">
           <h2>Writing</h2>
-          <PencilLine weight="duotone" />
+          <PencilLine size="1em" weight="duotone" />
         </div>
         <WritingDashboard />
       </div>
       <div className="space-y-5">
         <div className="flex w-full items-center justify-center gap-2 text-3xl font-semibold text-[#333] dark:text-[#f5f5f5] md:justify-start">
           <h2>Github</h2>
-          <GithubLogo weight="duotone" />
+          <GithubLogo size="1em" weight="duotone" />
         </div>
         <GithubDashboard />
       </div>
       <div className="space-y-5">
         <div className="flex w-full items-center justify-center gap-2 text-3xl font-semibold text-[#1db954] lg:justify-start">
           <h2>Spotify</h2>
-          <SpotifyLogo weight="duotone" />
+          <SpotifyLogo size="1em" weight="duotone" />
         </div>
         <SpotifyDashboard />
       </div>
diff --git a/src/app/blog/author/[author]/page.tsx b/src/app/blog/author/[author]/page.tsx
index 20c056d9..9a7ef053 100644
--- a/src/app/blog/author/[author]/page.tsx
+++ b/src/app/blog/author/[author]/page.tsx
@@ -36,7 +36,7 @@ export default function Page({ params }: Props) {
         </div>
         <div className="flex items-center gap-5 text-neutral-600 dark:text-neutral-400">
           <div className="flex items-center gap-1">
-            <Envelope weight="duotone" />
+            <Envelope size="1em" weight="duotone" />
             <span>{author.email}</span>
           </div>
           <a
@@ -46,7 +46,10 @@ export default function Page({ params }: Props) {
             className="group flex items-center gap-1 hover:text-black hover:dark:text-white"
           >
             <span>About me</span>
-            <ArrowRight className="opacity-0 group-hover:opacity-100" />
+            <ArrowRight
+              size="1em"
+              className="opacity-0 group-hover:opacity-100"
+            />
           </a>
         </div>
       </div>
diff --git a/src/app/blog/categories/[category]/page.tsx b/src/app/blog/categories/[category]/page.tsx
index e5fca0d8..21498e2f 100644
--- a/src/app/blog/categories/[category]/page.tsx
+++ b/src/app/blog/categories/[category]/page.tsx
@@ -33,7 +33,7 @@ export default function Page({ params }: Props) {
   return (
     <div className="content-container m-auto">
       <h1 className="mb-5 flex justify-center gap-2 text-2xl font-bold md:justify-start">
-        <FolderOpen weight="duotone" className="text-3xl" />
+        <FolderOpen size="1em" weight="duotone" className="text-3xl" />
         {getNormalCategoryString(category)}
       </h1>
       <main>
diff --git a/src/app/blog/categories/page.tsx b/src/app/blog/categories/page.tsx
index 5295a8fc..5dd95775 100644
--- a/src/app/blog/categories/page.tsx
+++ b/src/app/blog/categories/page.tsx
@@ -46,7 +46,7 @@ export default function Page() {
             >
               <div className="flex items-center gap-4 rounded-md bg-neutral-300/10 p-4 font-bold leading-none text-neutral-700 active:bg-blue-700/10 active:text-blue-700 dark:bg-neutral-800/10 dark:text-neutral-500 active:dark:bg-blue-500/10 active:dark:text-blue-500">
                 <span className="inline-flex items-end gap-1">
-                  <Folder weight="duotone" />
+                  <Folder size="1em" weight="duotone" />
                   <span>{categoryData.category}</span>
                 </span>
                 <span className="h-px flex-1 border-b border-dotted border-neutral-700 dark:border-neutral-500" />
diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
index 99522117..9a94cc9f 100644
--- a/src/app/blog/page.tsx
+++ b/src/app/blog/page.tsx
@@ -34,7 +34,7 @@ const TopLink = ({ Icon, title, ...rest }: TopLinkProps) => (
     {...rest}
     className="inline-flex items-center gap-1 rounded-lg p-2 leading-none text-neutral-700 transition-colors hover:bg-neutral-200/50 hover:text-neutral-900 dark:text-neutral-300 hover:dark:bg-neutral-900 dark:hover:text-neutral-100"
   >
-    <Icon />
+    <Icon size="1em" />
     <span>{title}</span>
   </Link>
 )
diff --git a/src/app/blog/post/[slug]/page.tsx b/src/app/blog/post/[slug]/page.tsx
index 30e5c120..5fdbb19d 100644
--- a/src/app/blog/post/[slug]/page.tsx
+++ b/src/app/blog/post/[slug]/page.tsx
@@ -103,7 +103,7 @@ export default function Page({ params }: Props) {
           <div>
             <div className="flex items-center gap-1">
               <span className="inline-flex items-center gap-1">
-                <CalendarBlank />
+                <CalendarBlank size="1em" />
                 <Date dateString={post.date} />
               </span>
               {post.lastUpdate && (
@@ -117,7 +117,7 @@ export default function Page({ params }: Props) {
             </div>
             <div className="flex items-center gap-1">
               <span className="group inline-flex items-center gap-1">
-                <Folder />
+                <Folder size="1em" />
                 <Link
                   href={`/blog/categories/${slug(post.category)}`}
                   className="group-dark:hover:text-blue-400 group-hover:text-blue-500"
@@ -126,7 +126,7 @@ export default function Page({ params }: Props) {
                 </Link>
               </span>
               <span className="group inline-flex items-center gap-1">
-                <Clock />
+                <Clock size="1em" />
                 <span>{Math.ceil(post.reading_time.minutes)} min read</span>
               </span>
             </div>
diff --git a/src/app/blog/tag/[tag]/page.tsx b/src/app/blog/tag/[tag]/page.tsx
index b8a971a3..2bca2cfe 100644
--- a/src/app/blog/tag/[tag]/page.tsx
+++ b/src/app/blog/tag/[tag]/page.tsx
@@ -31,7 +31,7 @@ export default function Page({ params }: Props) {
     <div className="content-container m-auto">
       <h1 className="mb-5 flex items-end justify-center gap-2 text-2xl font-bold md:justify-start">
         {getNormalTagString(tag)}
-        <Tag weight="duotone" />
+        <Tag size="1em" weight="duotone" />
       </h1>
       <main>
         <PostList posts={postList} />
diff --git a/src/app/components/footer.tsx b/src/app/components/footer.tsx
index 264c6b04..3cd78f61 100644
--- a/src/app/components/footer.tsx
+++ b/src/app/components/footer.tsx
@@ -11,7 +11,7 @@ const Link = ({ children, ...props }: ComponentProps<'a'>) => (
   </a>
 )
 
-const ArrowIcon = () => <ArrowUpRight className="text-xs" />
+const ArrowIcon = () => <ArrowUpRight size="1em" className="text-xs" />
 
 export function Footer() {
   return (
diff --git a/src/app/components/header/mobile-menu/index.tsx b/src/app/components/header/mobile-menu/index.tsx
index ca38a5ba..4ed38214 100644
--- a/src/app/components/header/mobile-menu/index.tsx
+++ b/src/app/components/header/mobile-menu/index.tsx
@@ -44,7 +44,7 @@ export function MobileMenu() {
         onClick={() => setIsDialogOpen(false)}
         className="menu-item"
       >
-        <Icon weight="duotone" />
+        <Icon size="1em" weight="duotone" />
         <span>{title}</span>
       </NextLink>
     )
@@ -55,10 +55,10 @@ export function MobileMenu() {
 
     return (
       <a {...props} className="menu-item" target="_blank">
-        <Icon weight="duotone" />
+        <Icon size="1em" weight="duotone" />
         <span className="flex items-end gap-px">
           <span>{title}</span>
-          <ArrowUpRight className="text-xs" />
+          <ArrowUpRight size="1em" className="text-xs" />
         </span>
       </a>
     )
@@ -77,7 +77,7 @@ export function MobileMenu() {
         }}
         className="menu-item"
       >
-        <MagnifyingGlass weight="duotone" />
+        <MagnifyingGlass size="1em" weight="duotone" />
         <span className="flex items-end gap-px">
           <span>Search</span>
         </span>
@@ -89,7 +89,7 @@ export function MobileMenu() {
     <Dialog.Root open={isDialogOpen} onOpenChange={setIsDialogOpen}>
       <Dialog.Trigger asChild className="md:hidden">
         <button aria-label="Open menu">
-          <List />
+          <List size="1em" />
         </button>
       </Dialog.Trigger>
       <Dialog.Portal>
@@ -101,7 +101,7 @@ export function MobileMenu() {
               className="absolute left-2 top-2 rounded-full p-2 backdrop-blur-lg active:bg-red-300/20 active:text-red-500 active:dark:bg-red-300/10 active:dark:text-red-400"
             >
               <button aria-label="Close">
-                <X weight="bold" />
+                <X size="1em" weight="bold" />
               </button>
             </Dialog.Close>
             <div className="flex flex-1 flex-col overflow-y-scroll rounded-bl-[2rem] rounded-tl-[2rem] bg-neutral-100 py-10 text-xl dark:bg-neutral-950">
diff --git a/src/app/components/header/mobile-menu/toggle-theme.tsx b/src/app/components/header/mobile-menu/toggle-theme.tsx
index 0201524c..66c02f85 100644
--- a/src/app/components/header/mobile-menu/toggle-theme.tsx
+++ b/src/app/components/header/mobile-menu/toggle-theme.tsx
@@ -12,21 +12,30 @@ export function ToggleTheme() {
           data-theme-light={currTheme === 'light'}
           className="p-4 data-[theme-light='true']:bg-neutral-300"
         >
-          <Sun weight={currTheme === 'light' ? 'duotone' : 'regular'} />
+          <Sun
+            size="1em"
+            weight={currTheme === 'light' ? 'duotone' : 'regular'}
+          />
         </button>
         <button
           onClick={() => setTheme('system')}
           data-theme-system={currTheme === 'system'}
           className="p-4 data-[theme-system='true']:bg-neutral-300 data-[theme-system='true']:dark:bg-neutral-800"
         >
-          <Desktop weight={currTheme === 'system' ? 'duotone' : 'regular'} />
+          <Desktop
+            size="1em"
+            weight={currTheme === 'system' ? 'duotone' : 'regular'}
+          />
         </button>
         <button
           onClick={() => setTheme('dark')}
           data-theme-dark={currTheme === 'dark'}
           className="p-4 data-[theme-dark='true']:bg-neutral-800"
         >
-          <Moon weight={currTheme === 'dark' ? 'duotone' : 'regular'} />
+          <Moon
+            size="1em"
+            weight={currTheme === 'dark' ? 'duotone' : 'regular'}
+          />
         </button>
       </div>
     </div>
diff --git a/src/app/components/header/search.tsx b/src/app/components/header/search.tsx
index 1cf2ee5a..466655c6 100644
--- a/src/app/components/header/search.tsx
+++ b/src/app/components/header/search.tsx
@@ -12,7 +12,7 @@ export function Search() {
       className="flex flex-1 cursor-text items-center gap-5 rounded-xl bg-neutral-200/20 p-2 text-sm leading-none backdrop-blur-3xl dark:bg-neutral-800/20"
     >
       <span className="flex items-center gap-3">
-        <MagnifyingGlass />
+        <MagnifyingGlass size="1em" />
         <span className="text-neutral-600 dark:text-neutral-400">
           Search...
         </span>
diff --git a/src/app/components/header/toggle-theme.tsx b/src/app/components/header/toggle-theme.tsx
index 698e1f7a..3618128f 100644
--- a/src/app/components/header/toggle-theme.tsx
+++ b/src/app/components/header/toggle-theme.tsx
@@ -26,19 +26,28 @@ export function ToggleTheme() {
     >
       {theme === 'light' && (
         <>
-          <Sun weight={currTheme === theme ? 'duotone' : 'regular'} />
+          <Sun
+            size="1em"
+            weight={currTheme === theme ? 'duotone' : 'regular'}
+          />
           <span>Light</span>
         </>
       )}
       {theme === 'dark' && (
         <>
-          <Moon weight={currTheme === theme ? 'duotone' : 'regular'} />
+          <Moon
+            size="1em"
+            weight={currTheme === theme ? 'duotone' : 'regular'}
+          />
           <span>Dark</span>
         </>
       )}
       {theme === 'system' && (
         <>
-          <Desktop weight={currTheme === theme ? 'duotone' : 'regular'} />
+          <Desktop
+            size="1em"
+            weight={currTheme === theme ? 'duotone' : 'regular'}
+          />
           <span>System</span>
         </>
       )}
@@ -48,7 +57,7 @@ export function ToggleTheme() {
   return (
     <Menu as="div" className="relative inline-flex items-center">
       <Menu.Button aria-label="Change color theme" title="Change color theme">
-        <PaintBrushBroad className="text-xl" />
+        <PaintBrushBroad size="1em" className="text-xl" />
       </Menu.Button>
       <Menu.Items
         as="div"
diff --git a/src/app/components/start-button.tsx b/src/app/components/start-button.tsx
index 20cebfff..99cda4d9 100644
--- a/src/app/components/start-button.tsx
+++ b/src/app/components/start-button.tsx
@@ -20,7 +20,10 @@ export function StartButton() {
       <span className="inline md:hidden">Click</span>
       <span>to start</span>
 
-      <ArrowRight className="duration-300 group-hover:translate-x-0 group-hover:opacity-100 md:-translate-x-full md:opacity-0" />
+      <ArrowRight
+        size="1em"
+        className="duration-300 group-hover:translate-x-0 group-hover:opacity-100 md:-translate-x-full md:opacity-0"
+      />
     </button>
   )
 }
diff --git a/src/app/sitemap/page.tsx b/src/app/sitemap/page.tsx
index a753315d..c7f860d7 100644
--- a/src/app/sitemap/page.tsx
+++ b/src/app/sitemap/page.tsx
@@ -13,7 +13,7 @@ export default function Page() {
           className="inline-flex items-end text-xl leading-none text-blue-500 hover:text-blue-900"
         >
           <span>Sitemap XML</span>
-          <ArrowUpRight className="text-sm" />
+          <ArrowUpRight size="1em" className="text-sm" />
         </a>
         {allRoutes.map(url => (
           <a
diff --git a/src/shared/components/api-error-message.tsx b/src/shared/components/api-error-message.tsx
index a15a2062..bbd9bcbe 100644
--- a/src/shared/components/api-error-message.tsx
+++ b/src/shared/components/api-error-message.tsx
@@ -2,7 +2,7 @@ import { Warning } from '@phosphor-icons/react/dist/ssr'
 
 export const ApiErrorMessage = () => (
   <span className="inline-flex items-center gap-2 text-red-500">
-    <Warning weight="duotone" />
+    <Warning size="1em" weight="duotone" />
     <span>API Error</span>
   </span>
 )
diff --git a/src/shared/components/kbar/index.tsx b/src/shared/components/kbar/index.tsx
index dec86381..8e493d7a 100644
--- a/src/shared/components/kbar/index.tsx
+++ b/src/shared/components/kbar/index.tsx
@@ -51,7 +51,7 @@ const ResultItem = forwardRef<
           <div className="flex items-end gap-px">
             <span className="leading-none">{action.name}</span>
             {action.id.startsWith('out') && (
-              <ArrowUpRight className="text-xs" />
+              <ArrowUpRight size="1em" className="text-xs" />
             )}
           </div>
           {action.subtitle && (
diff --git a/src/shared/components/kbar/provider.tsx b/src/shared/components/kbar/provider.tsx
index d284a69a..d269d237 100644
--- a/src/shared/components/kbar/provider.tsx
+++ b/src/shared/components/kbar/provider.tsx
@@ -47,7 +47,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'Home',
       shortcut: ['n', 'h'],
       keywords: 'homepage main',
-      icon: <House weight="duotone" />,
+      icon: <House size="1em" weight="duotone" />,
       perform: () => push('/')
     },
     {
@@ -55,7 +55,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'About',
       shortcut: ['n', 'a'],
       keywords: 'about me user information info',
-      icon: <User weight="duotone" />,
+      icon: <User size="1em" weight="duotone" />,
       perform: () => push('/about')
     },
     {
@@ -63,7 +63,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'Statistics',
       shortcut: ['n', 's'],
       keywords: 'statistics github spotify data',
-      icon: <ChartPieSlice weight="duotone" />,
+      icon: <ChartPieSlice size="1em" weight="duotone" />,
       perform: () => push('/about/statistics')
     }
   ]
@@ -74,7 +74,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     subtitle: project.description,
     keywords: [...project.tags, project.core_techs].toString(),
     section: 'Projects',
-    icon: <SquaresFour weight="duotone" />,
+    icon: <SquaresFour size="1em" weight="duotone" />,
     parent: 'search-projects',
     get perform() {
       if (project.website) return () => window.open(project.website, '_blank')
@@ -91,7 +91,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       shortcut: ['p'],
       section: 'Projects',
       keywords: 'works projects tools apps',
-      icon: <Briefcase weight="duotone" />,
+      icon: <Briefcase size="1em" weight="duotone" />,
       perform: () => push('/projects')
     },
     {
@@ -100,7 +100,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       shortcut: ['p', 's'],
       section: 'Projects',
       keywords: 'works projects tools apps',
-      icon: <MagnifyingGlass weight="duotone" />
+      icon: <MagnifyingGlass size="1em" weight="duotone" />
     },
     ...projectsAsActions
   ]
@@ -110,7 +110,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     .map(category => ({
       id: slug(category),
       name: category,
-      icon: <Folder weight="duotone" />,
+      icon: <Folder size="1em" weight="duotone" />,
       parent: 'categories',
       section: 'Blog',
       perform: () => push(`/blog/categories/${slug(category)}`)
@@ -120,23 +120,24 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     .map(tag => ({
       id: slug(tag),
       name: tag,
-      icon: <Tag weight="duotone" />,
+      icon: <Tag size="1em" weight="duotone" />,
       parent: 'tags',
       section: 'Blog',
       perform: () => push(`/blog/tag/${slug(tag)}`)
     }))
 
   const getIconByStatus = (status: 'published' | 'draft' | 'planned') => {
-    if (status === 'published') return <Article weight="duotone" />
-    if (status === 'draft') return <FileDashed weight="duotone" />
-    if (status === 'planned') return <PencilSimpleLine weight="duotone" />
+    if (status === 'published') return <Article size="1em" weight="duotone" />
+    if (status === 'draft') return <FileDashed size="1em" weight="duotone" />
+    if (status === 'planned')
+      return <PencilSimpleLine size="1em" weight="duotone" />
   }
   const postsAsAction: Action[] = getSortedPosts(
     allPosts.filter(post => post.status !== 'planned')
   ).map(({ id, title, status, test, tags, description }) => ({
     id,
     name: title,
-    icon: test ? <Code weight="duotone" /> : getIconByStatus(status),
+    icon: test ? <Code size="1em" weight="duotone" /> : getIconByStatus(status),
     keywords: tags
       .split(',')
       .map(tag => tag.trim())
@@ -150,7 +151,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
   const tilsAsAction: Action[] = allTILs.map(til => ({
     id: slug(til.title),
     name: til.title,
-    icon: <Notebook weight="duotone" />,
+    icon: <Notebook size="1em" weight="duotone" />,
     keywords: til.tags
       .map(tag => tag.trim())
       .toString()
@@ -168,7 +169,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       shortcut: ['b'],
       section: 'Blog',
       keywords: 'posts writing',
-      icon: <Note weight="duotone" />,
+      icon: <Note size="1em" weight="duotone" />,
       perform: () => push('/blog')
     },
     {
@@ -177,7 +178,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       shortcut: ['b', 'i'],
       section: 'Blog',
       keywords: 'writing learning progress skills',
-      icon: <Notebook weight="duotone" />,
+      icon: <Notebook size="1em" weight="duotone" />,
       perform: () => push('/blog/til')
     },
     {
@@ -186,7 +187,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       shortcut: ['b', 'c'],
       section: 'Blog',
       keywords: 'posts writing',
-      icon: <FolderOpen weight="duotone" />
+      icon: <FolderOpen size="1em" weight="duotone" />
     },
     ...categoriesAsAction,
     {
@@ -195,7 +196,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       shortcut: ['b', 't'],
       section: 'Blog',
       keywords: 'posts writing',
-      icon: <Tag weight="duotone" />
+      icon: <Tag size="1em" weight="duotone" />
     },
     ...tagsAsAction,
     {
@@ -203,7 +204,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'Rss',
       section: 'Blog',
       keywords: 'feed rss atom',
-      icon: <Rss weight="duotone" />,
+      icon: <Rss size="1em" weight="duotone" />,
       perform: () => push('/blog/feed')
     },
     {
@@ -212,7 +213,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       section: 'Blog',
       keywords: 'search posts write writing blog',
       shortcut: ['b', 's'],
-      icon: <MagnifyingGlass weight="duotone" />
+      icon: <MagnifyingGlass size="1em" weight="duotone" />
     },
     ...postsAsAction,
     ...tilsAsAction
@@ -224,7 +225,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'My Manjaro Dotfiles',
       section: 'Personal Links',
       keywords: 'linux config setup',
-      icon: <Files weight="duotone" />,
+      icon: <Files size="1em" weight="duotone" />,
       perform: () =>
         window.open('https://github.com/mateusfg7/dotfiles', '_blank')
     },
@@ -233,7 +234,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'My Bookshelf',
       section: 'Personal Links',
       keywords: 'books library',
-      icon: <Books weight="duotone" />,
+      icon: <Books size="1em" weight="duotone" />,
       perform: () =>
         window.open(
           'https://www.skoob.com.br/estante/livros/todos/8289961',
@@ -247,7 +248,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'Source code',
       section: 'Website',
       keywords: 'repo source github código fonte',
-      icon: <GithubLogo weight="duotone" />,
+      icon: <GithubLogo size="1em" weight="duotone" />,
       perform: () =>
         window.open('https://github.com/mateusfg7/mateusf.com', '_blank')
     },
@@ -256,7 +257,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'License',
       section: 'Website',
       keywords: 'mit gpl',
-      icon: <File weight="duotone" />,
+      icon: <File size="1em" weight="duotone" />,
       perform: () =>
         window.open(
           'https://github.com/mateusfg7/mateusf.com/blob/main/LICENSE',
@@ -268,7 +269,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'Analytics',
       section: 'Website',
       keywords: 'stats graph traffic',
-      icon: <ChartLine weight="duotone" />,
+      icon: <ChartLine size="1em" weight="duotone" />,
       perform: () =>
         window.open(
           'https://analytics.umami.is/share/IV950FFonuZg4Rbn/mateusf.com',
@@ -280,7 +281,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
       name: 'Sitemap',
       section: 'Website',
       keywords: 'map links crawler',
-      icon: <TreeStructure weight="duotone" />,
+      icon: <TreeStructure size="1em" weight="duotone" />,
       perform: () => push('/sitemap')
     }
   ]
@@ -289,7 +290,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     {
       id: 'set-theme',
       name: 'Change theme',
-      icon: <Palette weight="duotone" />,
+      icon: <Palette size="1em" weight="duotone" />,
       keywords: 'theme dark light',
       shortcut: ['c', 't'],
       section: 'Configurations'
@@ -297,7 +298,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     {
       id: 'system-theme',
       name: 'System colors',
-      icon: <Desktop weight="duotone" />,
+      icon: <Desktop size="1em" weight="duotone" />,
       parent: 'set-theme',
       keywords: 'theme dark light',
       perform: () => setTheme('system')
@@ -305,7 +306,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     {
       id: 'dark-theme',
       name: 'Dark mode',
-      icon: <Moon weight="duotone" />,
+      icon: <Moon size="1em" weight="duotone" />,
       parent: 'set-theme',
       keywords: 'theme dark light',
       perform: () => setTheme('dark')
@@ -313,7 +314,7 @@ export function CustomKBarProvider({ children }: { children: ReactNode }) {
     {
       id: 'light-theme',
       name: 'Light mode',
-      icon: <Sun weight="duotone" />,
+      icon: <Sun size="1em" weight="duotone" />,
       parent: 'set-theme',
       keywords: 'theme dark light',
       perform: () => setTheme('light')
diff --git a/src/shared/components/post-list/post-badges.tsx b/src/shared/components/post-list/post-badges.tsx
index b8865a6b..05019a01 100644
--- a/src/shared/components/post-list/post-badges.tsx
+++ b/src/shared/components/post-list/post-badges.tsx
@@ -8,18 +8,18 @@ import {
 
 export const DraftBadge = () => (
   <div className="common-badge border-amber-600/20 bg-amber-600/5 text-amber-600">
-    <FileDashed /> Draft
+    <FileDashed size="1em" /> Draft
   </div>
 )
 
 export const PlannedBadge = () => (
   <div className="common-badge border-sky-600/20 bg-sky-600/5 text-sky-600">
-    <PencilSimpleLine /> Planned
+    <PencilSimpleLine size="1em" /> Planned
   </div>
 )
 
 export const TestBadge = () => (
   <div className="common-badge border-green-600/20 bg-green-600/5 text-green-600">
-    <Code /> Test
+    <Code size="1em" /> Test
   </div>
 )
diff --git a/src/shared/components/post-list/post-link.tsx b/src/shared/components/post-list/post-link.tsx
index 60648e76..0838f767 100644
--- a/src/shared/components/post-list/post-link.tsx
+++ b/src/shared/components/post-list/post-link.tsx
@@ -19,10 +19,11 @@ interface Props {
 }
 
 const TitleIcon = ({ category }: { category: string }) => {
-  if (category === 'How To') return <CompassTool weight="duotone" />
-  if (category === 'Article') return <TextAlignLeft weight="duotone" />
-  if (category === 'Notes') return <NoteBlank weight="duotone" />
-  if (category === 'List') return <ListBullets weight="duotone" />
+  if (category === 'How To') return <CompassTool size="1em" weight="duotone" />
+  if (category === 'Article')
+    return <TextAlignLeft size="1em" weight="duotone" />
+  if (category === 'Notes') return <NoteBlank size="1em" weight="duotone" />
+  if (category === 'List') return <ListBullets size="1em" weight="duotone" />
 
   return <></>
 }
@@ -53,7 +54,7 @@ export function PostLink({ post, hideYear = false }: Props) {
       <span className="flex items-center gap-4 whitespace-nowrap leading-none text-neutral-600 group-hover:text-neutral-700 dark:group-hover:text-neutral-400 md:flex-col md:items-end md:justify-center md:gap-2">
         {showDate && (
           <span className="inline-flex items-center gap-1 md:flex-row-reverse">
-            <CalendarBlank />
+            <CalendarBlank size="1em" />
             <Date
               dateString={post.date}
               dateFormat={hideYear ? 'LLL d' : 'LLL d, yyyy'}
@@ -63,7 +64,7 @@ export function PostLink({ post, hideYear = false }: Props) {
 
         {showReadingTime && (
           <span className="inline-flex items-center gap-1 md:flex-row-reverse">
-            <Clock />
+            <Clock size="1em" />
             <span>{Math.ceil(post.reading_time.minutes)} min read</span>
           </span>
         )}