diff --git a/app/plant-page/all-plants/[plantId]/page.tsx b/app/plant-page/all-plants/[plantId]/page.tsx
index 9bf7207..b5b5d5c 100644
--- a/app/plant-page/all-plants/[plantId]/page.tsx
+++ b/app/plant-page/all-plants/[plantId]/page.tsx
@@ -4,10 +4,12 @@ import { useEffect, useState } from 'react';
 import { useParams, useRouter } from 'next/navigation';
 import { UUID } from 'crypto';
 import { getPlantById } from '@/api/supabase/queries/plants';
+import { SmallButton } from '@/components/Buttons';
 import DifficultyLevelBar from '@/components/DifficultyLevelBar';
 import GardeningTips from '@/components/GardeningTips';
 import PlantCalendarRow from '@/components/PlantCalendarRow';
 import PlantCareDescription from '@/components/PlantCareDescription';
+import COLORS from '@/styles/colors';
 import { Flex } from '@/styles/containers';
 import { H4 } from '@/styles/text';
 import { Plant } from '@/types/schema';
@@ -22,7 +24,6 @@ import {
   PlantImage,
   PlantName,
 } from '../../style';
-import { AddPlant } from './style';
 
 export default function GeneralPlantPage() {
   const router = useRouter();
@@ -71,7 +72,9 @@ export default function GeneralPlantPage() {
           </NameWrapper>
           {/*Add button only appears if user is logged in and onboarded*/}
           {profileReady && profileData && (
-            <AddPlant onClick={handleAdd}>Add +</AddPlant>
+            <SmallButton $primaryColor={COLORS.shrub} onClick={handleAdd}>
+              Add +
+            </SmallButton>
           )}
         </Flex>
         <ComponentWrapper>
diff --git a/app/plant-page/all-plants/[plantId]/style.ts b/app/plant-page/all-plants/[plantId]/style.ts
deleted file mode 100644
index 4026041..0000000
--- a/app/plant-page/all-plants/[plantId]/style.ts
+++ /dev/null
@@ -1,81 +0,0 @@
-import styled from 'styled-components';
-import COLORS from '@/styles/colors';
-
-export const Container = styled.div`
-  padding: 20px;
-`;
-
-export const Header = styled.div`
-  background-color: ${COLORS.glimpse};
-  margin: -28px -28px 24px -28px;
-  padding: 12px 20px;
-  padding-bottom: 27px;
-`;
-
-export const HeaderContent = styled.div`
-  position: relative;
-  max-width: 100%;
-`;
-
-export const ButtonWrapper = styled.div`
-  display: flex;
-  justify-content: space-between;
-  width: 100%;
-  padding-top: 24px;
-`;
-
-export const BackButton = styled.button`
-  background: none;
-  border: none;
-  font-size: 1.125rem;
-  cursor: pointer;
-  padding: 0;
-`;
-
-export const PlantImage = styled.img`
-  max-width: 150px;
-  height: auto;
-  margin: 9px auto 0;
-  display: block;
-`;
-
-export const Content = styled.div`
-  display: flex;
-  flex-direction: column;
-  gap: 20px;
-`;
-
-export const NameWrapper = styled.div`
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  gap: 8.5px;
-`;
-
-export const PlantName = styled.h1`
-  text-align: center;
-  font-size: 1.5rem;
-  font-style: normal;
-  font-weight: 400;
-  line-height: normal;
-  margin: 0;
-`;
-
-export const TitleWrapper = styled.div`
-  display: flex;
-  flex-direction: row;
-  gap: 2px;
-  justify-content: space-between;
-`;
-export const AddPlant = styled.button`
-  background-color: ${COLORS.shrub};
-  color: white;
-  padding: 8px 16px;
-  border: none;
-  border-radius: 5px;
-  cursor: pointer;
-  font-size: 0.75rem;
-  font-style: inherit;
-  font-weight: 400;
-  line-height: normal;
-`;
diff --git a/app/plant-page/my-garden/[userPlantId]/page.tsx b/app/plant-page/my-garden/[userPlantId]/page.tsx
index 67c5c78..e26c845 100644
--- a/app/plant-page/my-garden/[userPlantId]/page.tsx
+++ b/app/plant-page/my-garden/[userPlantId]/page.tsx
@@ -8,13 +8,15 @@ import {
   getUserPlantById,
   upsertUserPlant,
 } from '@/api/supabase/queries/userPlants';
+import { SmallButton } from '@/components/Buttons';
 import DifficultyLevelBar from '@/components/DifficultyLevelBar';
 import GardeningTips from '@/components/GardeningTips';
 import PlantCalendarRow from '@/components/PlantCalendarRow';
 import PlantCareDescription from '@/components/PlantCareDescription';
 import YourPlantDetails from '@/components/YourPlantDetails';
+import COLORS from '@/styles/colors';
 import { Flex } from '@/styles/containers';
-import { H4 } from '@/styles/text';
+import { H4, P3 } from '@/styles/text';
 import { Plant, UserPlant } from '@/types/schema';
 import { getCurrentTimestamp } from '@/utils/helpers';
 import {
@@ -27,7 +29,6 @@ import {
   PlantImage,
   PlantName,
 } from '../../style';
-import { RemoveButton, Subtitle } from './style';
 
 export default function UserPlantPage() {
   const router = useRouter();
@@ -69,7 +70,9 @@ export default function UserPlantPage() {
           >
             ←
           </BackButton>
-          <RemoveButton onClick={removePlant}>X Remove</RemoveButton>
+          <SmallButton $primaryColor={COLORS.errorRed} onClick={removePlant}>
+            X Remove
+          </SmallButton>
         </ButtonWrapper>
         <PlantImage src={currentPlant.img} alt={currentPlant.plant_name} />
       </ImgHeader>
@@ -82,7 +85,13 @@ export default function UserPlantPage() {
               difficultyLevel={currentPlant.difficulty_level}
             />
           </NameWrapper>
-          <Subtitle>You have this plant in your garden!</Subtitle>
+          <P3
+            $fontWeight={400}
+            $color={COLORS.shrub}
+            style={{ fontStyle: 'italic' }}
+          >
+            You have this plant in your garden!
+          </P3>
         </Flex>
         <ComponentWrapper>
           <YourPlantDetails
diff --git a/app/plant-page/my-garden/[userPlantId]/style.ts b/app/plant-page/my-garden/[userPlantId]/style.ts
deleted file mode 100644
index b0351d7..0000000
--- a/app/plant-page/my-garden/[userPlantId]/style.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import styled from 'styled-components';
-import COLORS from '@/styles/colors';
-import { P3 } from '@/styles/text';
-
-// only for UserPlantPage
-export const RemoveButton = styled.button`
-  background-color: ${COLORS.shrub};
-  color: white;
-  padding: 8px 16px;
-  border: none;
-  border-radius: 5px;
-  cursor: pointer;
-  font-size: 0.75rem;
-  font-style: inherit;
-  font-weight: 400;
-  line-height: normal;
-`;
-
-// Only for UserPlantPage
-export const Subtitle = styled(P3)`
-  font-style: italic;
-  font-weight: 400;
-  color: ${COLORS.shrub};
-`;
diff --git a/components/Buttons.tsx b/components/Buttons.tsx
index 5b3c032..46f37fc 100644
--- a/components/Buttons.tsx
+++ b/components/Buttons.tsx
@@ -80,5 +80,5 @@ export const SmallButton = styled(P3).attrs({ as: 'button' })<ButtonProps>`
   border-radius: 20px;
   min-width: 60px;
   height: 24px;
-  padding: 4px 4px;
+  padding: 4px 10px;
 `;