diff --git a/components/CollectionCard.tsx b/components/CollectionCard.tsx
index 6508cff..5efac28 100644
--- a/components/CollectionCard.tsx
+++ b/components/CollectionCard.tsx
@@ -96,7 +96,6 @@ export default function ({
           </div>
         </div>
       </Link>
-
       {expandDropdown ? (
         <Dropdown
           items={[
@@ -130,7 +129,6 @@ export default function ({
           className="absolute top-[3.2rem] right-5 z-10 w-36"
         />
       ) : null}
-
       {editCollectionModal ? (
         <Modal toggleModal={toggleEditCollectionModal}>
           <CollectionInfo
@@ -140,7 +138,6 @@ export default function ({
           />
         </Modal>
       ) : null}
-
       {collectionMembersModal ? (
         <Modal toggleModal={toggleCollectionMembersModal}>
           <TeamManagement
@@ -149,7 +146,6 @@ export default function ({
           />
         </Modal>
       ) : null}
-
       {deleteCollectionModal ? (
         <Modal toggleModal={toggleDeleteCollectionModal}>
           <DeleteCollection
diff --git a/components/LinkList.tsx b/components/LinkList.tsx
index 3f05167..ff174d0 100644
--- a/components/LinkList.tsx
+++ b/components/LinkList.tsx
@@ -61,7 +61,7 @@ export default function ({ link, count }: Props) {
         width={42}
         height={42}
         alt=""
-        className="select-none mt-3 z-10 rounded-full shadow border-[3px] border-sky-100"
+        className="select-none mt-3 z-10 rounded-full shadow border-[3px] border-white bg-white"
         draggable="false"
         onError={(e) => {
           const target = e.target as HTMLElement;
diff --git a/components/Modal/Collection/CollectionInfo.tsx b/components/Modal/Collection/CollectionInfo.tsx
index 145517f..158e9a5 100644
--- a/components/Modal/Collection/CollectionInfo.tsx
+++ b/components/Modal/Collection/CollectionInfo.tsx
@@ -5,23 +5,10 @@
 
 import React, { useState } from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-  faClose,
-  faPenToSquare,
-  faPlus,
-  faTrashCan,
-  faUser,
-  faUserPlus,
-} from "@fortawesome/free-solid-svg-icons";
+import { faPenToSquare, faPlus } from "@fortawesome/free-solid-svg-icons";
 import useCollectionStore from "@/store/collections";
-import { CollectionIncludingMembers, Member } from "@/types/global";
-import { useSession } from "next-auth/react";
-import Modal from "@/components/Modal";
-import DeleteCollection from "@/components/Modal/Collection/DeleteCollection";
+import { CollectionIncludingMembers } from "@/types/global";
 import RequiredBadge from "../../RequiredBadge";
-import addMemberToCollection from "@/lib/client/addMemberToCollection";
-import ImageWithFallback from "../../ImageWithFallback";
-import Checkbox from "../../Checkbox";
 
 type Props = {
   toggleCollectionModal: Function;
diff --git a/components/Modal/Collection/TeamManagement.tsx b/components/Modal/Collection/TeamManagement.tsx
index df399fa..d370b57 100644
--- a/components/Modal/Collection/TeamManagement.tsx
+++ b/components/Modal/Collection/TeamManagement.tsx
@@ -30,8 +30,6 @@ export default function TeamManagement({
   const [collection, setCollection] =
     useState<CollectionIncludingMembers>(activeCollection);
 
-  const [isPublic, setIsPublic] = useState(false);
-
   const currentURL = new URL(document.URL);
 
   const publicCollectionURL = `${currentURL.origin}/public/collections/${collection.id}`;
@@ -87,15 +85,17 @@ export default function TeamManagement({
 
       <Checkbox
         label="Make this a public collection."
-        state={isPublic}
-        onClick={() => setIsPublic(!isPublic)}
+        state={collection.isPublic}
+        onClick={() =>
+          setCollection({ ...collection, isPublic: !collection.isPublic })
+        }
       />
 
       <p className="text-gray-500 text-sm">
         This will let <b>Anyone</b> to view this collection.
       </p>
 
-      {isPublic ? (
+      {collection.isPublic ? (
         <div>
           <p className="mb-2 text-gray-500">Public Link (Click to copy)</p>
           <div
diff --git a/components/Navbar.tsx b/components/Navbar.tsx
index 792d300..dc2b9b8 100644
--- a/components/Navbar.tsx
+++ b/components/Navbar.tsx
@@ -52,7 +52,6 @@ export default function () {
   };
 
   return (
-    // lg:ml-64 xl:ml-80
     <div className="flex justify-between gap-2 items-center px-5 py-2 border-solid border-b-sky-100 border-b h-16">
       <div
         onClick={toggleSidebar}
@@ -72,23 +71,23 @@ export default function () {
 
         <div className="relative">
           <div
-            className="flex gap-1 group items-center w-fit bg-white text-gray-600 cursor-pointer"
+            className="flex gap-1 group items-center w-fit bg-white cursor-pointer"
             onClick={() => setProfileDropdown(!profileDropdown)}
             id="profile-dropdown"
           >
             {account.profilePic ? (
               <img
                 src={account.profilePic}
-                className="h-10 w-10 shadow pointer-events-none rounded-full border-[3px] border-sky-100 group-hover:border-sky-500 duration-100"
+                className="h-10 w-10 shadow pointer-events-none rounded-full border-[3px] border-sky-500 group-hover:border-sky-400 duration-100"
                 alt=""
               />
             ) : (
               <FontAwesomeIcon
                 icon={faCircleUser}
-                className="h-10 w-10 pointer-events-none group-hover:text-sky-600 duration-100"
+                className="h-10 w-10 pointer-events-none text-sky-500 group-hover:text-sky-400 duration-100"
               />
             )}
-            <div className="pointer-events-none hidden sm:block group-hover:text-sky-600 duration-100">
+            <div className="pointer-events-none hidden sm:block text-sky-500 group-hover:text-sky-400 duration-100">
               <div className="flex item-center gap-1">
                 <p className="font-bold leading-3 hidden sm:block">
                   {account.name}
diff --git a/lib/api/controllers/collections/updateCollection.ts b/lib/api/controllers/collections/updateCollection.ts
index 1e6f436..1d51130 100644
--- a/lib/api/controllers/collections/updateCollection.ts
+++ b/lib/api/controllers/collections/updateCollection.ts
@@ -35,6 +35,7 @@ export default async function (
       data: {
         name: collection.name,
         description: collection.description,
+        isPublic: collection.isPublic,
         members: {
           create: collection.members.map((e) => ({
             user: { connect: { email: e.user.email } },
diff --git a/prisma/migrations/20230523040650_init/migration.sql b/prisma/migrations/20230528224940_init/migration.sql
similarity index 98%
rename from prisma/migrations/20230523040650_init/migration.sql
rename to prisma/migrations/20230528224940_init/migration.sql
index 351f017..f317c9c 100644
--- a/prisma/migrations/20230523040650_init/migration.sql
+++ b/prisma/migrations/20230528224940_init/migration.sql
@@ -16,6 +16,7 @@ CREATE TABLE "Collection" (
     "id" SERIAL NOT NULL,
     "name" TEXT NOT NULL,
     "description" TEXT NOT NULL DEFAULT '',
+    "isPublic" BOOLEAN NOT NULL DEFAULT false,
     "ownerId" INTEGER NOT NULL,
     "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
 
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index f80505e..10f14df 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -29,6 +29,7 @@ model Collection {
   id Int @id @default(autoincrement())
   name String
   description String @default("")
+  isPublic Boolean @default(false)
   owner User @relation(fields: [ownerId], references: [id])
   ownerId Int
   members UsersAndCollections[]