diff --git a/assets/new.svg b/assets/new.svg
index 7339d0b5..a61a79be 100644
--- a/assets/new.svg
+++ b/assets/new.svg
@@ -1,3 +1,3 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M5 11C5 11.5523 5.44772 12 6 12C6.55228 12 7 11.5523 7 11V7.00006H11C11.5523 7.00006 12 6.55235 12 6.00006C12 5.44778 11.5523 5.00006 11 5.00006H7V1C7 0.447715 6.55228 0 6 0C5.44771 0 5 0.447715 5 1V5.00006H1C0.447715 5.00006 0 5.44778 0 6.00006C0 6.55235 0.447715 7.00006 1 7.00006H5V11Z" />
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M5 11C5 11.5523 5.44772 12 6 12C6.55228 12 7 11.5523 7 11V7.00006H11C11.5523 7.00006 12 6.55235 12 6.00006C12 5.44778 11.5523 5.00006 11 5.00006H7V1C7 0.447715 6.55228 0 6 0C5.44771 0 5 0.447715 5 1V5.00006H1C0.447715 5.00006 0 5.44778 0 6.00006C0 6.55235 0.447715 7.00006 1 7.00006H5V11Z" />
 </svg>
diff --git a/assets/star.svg b/assets/star.svg
new file mode 100644
index 00000000..699249c5
--- /dev/null
+++ b/assets/star.svg
@@ -0,0 +1,3 @@
+<svg width="14" height="13" viewBox="0 0 14 13" xmlns="http://www.w3.org/2000/svg">
+    <path d="M6.04894 0.927052C6.3483 0.00574152 7.6517 0.00574078 7.95106 0.927051L8.79611 3.52786C8.92999 3.93989 9.31394 4.21885 9.74717 4.21885H12.4818C13.4505 4.21885 13.8533 5.45846 13.0696 6.02786L10.8572 7.63525C10.5067 7.8899 10.3601 8.34127 10.494 8.75329L11.339 11.3541C11.6384 12.2754 10.5839 13.0415 9.80017 12.4721L7.58779 10.8647C7.2373 10.6101 6.7627 10.6101 6.41221 10.8647L4.19983 12.4721C3.41612 13.0415 2.36164 12.2754 2.66099 11.3541L3.50604 8.75329C3.63992 8.34127 3.49326 7.8899 3.14277 7.63525L0.930391 6.02787C0.146678 5.45846 0.549452 4.21885 1.51818 4.21885H4.25283C4.68606 4.21885 5.07001 3.93989 5.20389 3.52786L6.04894 0.927052Z" />
+</svg>
diff --git a/src/components/UncapIndicator/UncapIndicator.css b/src/components/UncapIndicator/UncapIndicator.css
new file mode 100644
index 00000000..ceafd8d2
--- /dev/null
+++ b/src/components/UncapIndicator/UncapIndicator.css
@@ -0,0 +1,10 @@
+.UncapIndicator {
+    display: flex;
+    flex-direction: row;
+    align-content: center;
+    justify-content: center;
+    gap: 2px;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
\ No newline at end of file
diff --git a/src/components/UncapIndicator/UncapIndicator.tsx b/src/components/UncapIndicator/UncapIndicator.tsx
new file mode 100644
index 00000000..b5a9f5ce
--- /dev/null
+++ b/src/components/UncapIndicator/UncapIndicator.tsx
@@ -0,0 +1,39 @@
+import React from 'react'
+import classnames from 'classnames'
+import UncapStar from '~components/UncapStar/UncapStar'
+
+import './UncapIndicator.css'
+
+
+interface Props {
+    uncapLevel: number
+    flb: boolean
+    ulb: boolean
+}
+
+const UncapIndicator = (props: Props) => {
+    let numStars
+    if (props.ulb) {
+        numStars = 5
+    } else if (props.flb) {
+        numStars = 4
+    } else {
+        numStars = 3
+    }
+
+    return (
+        <ul className="UncapIndicator">
+            {
+                Array.from(Array(numStars)).map((x, i) => {
+                    if (i > 2) {
+                        return <UncapStar uncap={true} key={`star_${i}`} />
+                    } else {
+                        return <UncapStar uncap={false} key={`star_${i}`} />
+                    }
+                })
+            }
+        </ul>
+    )
+}
+
+export default UncapIndicator
\ No newline at end of file
diff --git a/src/components/UncapStar/UncapStar.css b/src/components/UncapStar/UncapStar.css
new file mode 100644
index 00000000..7014dbef
--- /dev/null
+++ b/src/components/UncapStar/UncapStar.css
@@ -0,0 +1,7 @@
+.UncapStar {
+    color: #FFA15E;
+}
+
+.UncapStar.uncap {
+    color: #65DAFF;
+}
\ No newline at end of file
diff --git a/src/components/UncapStar/UncapStar.tsx b/src/components/UncapStar/UncapStar.tsx
new file mode 100644
index 00000000..de255ab6
--- /dev/null
+++ b/src/components/UncapStar/UncapStar.tsx
@@ -0,0 +1,23 @@
+import React from 'react'
+import classnames from 'classnames'
+
+import './UncapStar.css'
+
+import Star from '../../../assets/star'
+
+interface Props {
+    uncap: boolean
+}
+
+const UncapStar = (props: Props) => {
+    const classes = classnames({
+        UncapStar: true,
+        'uncap': props.uncap
+    })
+
+    return (
+        <li className={classes}><Star /></li>
+    )
+}
+
+export default UncapStar
\ No newline at end of file
diff --git a/src/components/WeaponGrid/WeaponGrid.css b/src/components/WeaponGrid/WeaponGrid.css
index d4722a79..ad176b84 100644
--- a/src/components/WeaponGrid/WeaponGrid.css
+++ b/src/components/WeaponGrid/WeaponGrid.css
@@ -14,7 +14,7 @@
 }
 
 #grid_weapons > * {
-    margin-bottom: 72px;
+    margin-bottom: 24px;
     margin-right: 24px;
 
 }
diff --git a/src/components/WeaponGridMainhand/WeaponGridMainhand.css b/src/components/WeaponGridMainhand/WeaponGridMainhand.css
index a14187b8..5e1696bb 100644
--- a/src/components/WeaponGridMainhand/WeaponGridMainhand.css
+++ b/src/components/WeaponGridMainhand/WeaponGridMainhand.css
@@ -1,31 +1,47 @@
 .WeaponGridMainhand {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    font-size: 14px;
+    margin-right: 24px;
+    max-width: 200px;
+}
+
+.WeaponGridMainhand .WeaponGridImage {
+    display: flex;
     align-items: center;
+    justify-content: center;
+
     background: white;
     border: 1px solid rgba(0, 0, 0, 0);
     border-radius: 8px;
-    display: flex;
     height: 420px;
-    justify-content: center;
-    margin-right: 24px;
     overflow: hidden;
     transition: all 0.18s ease-in-out;
     width: 200px;
 }
 
-.WeaponGridMainhand.editable:hover {
+.editable .WeaponGridMainhand:hover {
     border: 1px solid rgba(0, 0, 0, 0.1);
     box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px;
     cursor: pointer;
     transform: scale(1.05, 1.05);
 }
 
+.WeaponGridMainhand h3 {
+    color: #333;
+    font-weight: 500;
+    margin: 0;
+    text-align: center;
+}
+
 .WeaponGridMainhand img {
     position: relative;
     width: 100%;
     z-index: 2;
 }
 
-.WeaponGridMainhand .icon {
+.WeaponGridImage .icon {
     position: absolute;
     color: #c9c9c9;
     height: 20px;
@@ -33,6 +49,6 @@
     z-index: 1;
 }
 
-.WeaponGridMainhand:hover .icon {
+.WeaponGridImage:hover .icon {
     color: #555;
 }
\ No newline at end of file
diff --git a/src/components/WeaponGridMainhand/WeaponGridMainhand.tsx b/src/components/WeaponGridMainhand/WeaponGridMainhand.tsx
index 15328ce9..2865cf37 100644
--- a/src/components/WeaponGridMainhand/WeaponGridMainhand.tsx
+++ b/src/components/WeaponGridMainhand/WeaponGridMainhand.tsx
@@ -1,8 +1,10 @@
 import React, { useEffect } from 'react'
 import classnames from 'classnames'
-import SearchModal from '~components/SearchModal/SearchModal'
 import { useModal as useModal } from '~utils/useModal'
 
+import SearchModal from '~components/SearchModal/SearchModal'
+import UncapIndicator from '~components/UncapIndicator/UncapIndicator'
+
 import mainhandImages from '../../images/mainhand/*.jpg'
 import Plus from '../../../assets/plus.svg'
 
@@ -33,11 +35,21 @@ function WeaponGridMainhand(props: WeaponGridProps) {
         'editable': props.editable
     })
 
+    const weapon = props.weapon
+
     return (
         <div>
             <div className={classes} onClick={openModalIfEditable}>
-                <img className="grid_image" src={imgSrc} />
-                { (props.editable) ? <span className='icon'><Plus /></span> : '' }
+                <div className="WeaponGridImage">
+                    <img className="grid_image" src={imgSrc} />
+                    { (props.editable) ? <span className='icon'><Plus /></span> : '' }
+                </div>
+                <UncapIndicator 
+                    ulb={weapon?.uncap.ulb || false} 
+                    flb={weapon?.uncap.flb || false }
+                    uncapLevel={3}
+                />
+                <h3 className="WeaponName">{weapon?.name.en}</h3>
             </div>
             {open ? (
                 <SearchModal 
diff --git a/src/components/WeaponGridUnit/WeaponGridUnit.css b/src/components/WeaponGridUnit/WeaponGridUnit.css
index 5946b16d..dc9c41d2 100644
--- a/src/components/WeaponGridUnit/WeaponGridUnit.css
+++ b/src/components/WeaponGridUnit/WeaponGridUnit.css
@@ -1,4 +1,12 @@
 .WeaponGridUnit {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    font-size: 14px;
+    max-width: 160px;
+}
+
+.WeaponGridUnit .WeaponGridImage {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -13,20 +21,27 @@
     width: 160px;
 }
 
-.WeaponGridUnit.editable:hover {
+.editable .WeaponGridImage:hover {
     border: 1px solid rgba(0, 0, 0, 0.1);
     box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 14px;
     cursor: pointer;
     transform: scale(1.1, 1.1);
 }
 
+.WeaponGridUnit h3 {
+    color: #333;
+    font-weight: 500;
+    margin: 0;
+    text-align: center;
+}
+
 .WeaponGridUnit img {
     position: relative;
     width: 100%;
     z-index: 2;
 }
 
-.WeaponGridUnit .icon {
+.WeaponGridImage .icon {
     position: absolute;
     color: #c9c9c9;
     height: 20px;
@@ -34,6 +49,6 @@
     z-index: 1;
 }
 
-.WeaponGridUnit:hover .icon {
+.WeaponGridImage:hover .icon {
     color: #555;
 }
\ No newline at end of file
diff --git a/src/components/WeaponGridUnit/WeaponGridUnit.tsx b/src/components/WeaponGridUnit/WeaponGridUnit.tsx
index dbd42918..1878e801 100644
--- a/src/components/WeaponGridUnit/WeaponGridUnit.tsx
+++ b/src/components/WeaponGridUnit/WeaponGridUnit.tsx
@@ -1,8 +1,10 @@
 import React from 'react'
 import classnames from 'classnames'
-import SearchModal from '~components/SearchModal/SearchModal'
 import { useModal as useModal } from '~utils/useModal'
 
+import SearchModal from '~components/SearchModal/SearchModal'
+import UncapIndicator from '~components/UncapIndicator/UncapIndicator'
+
 import gridImages from '../../images/grid/*.jpg'
 import Plus from '../../../assets/plus.svg'
 
@@ -15,6 +17,7 @@ function WeaponGridUnit(props: WeaponGridProps) {
     if (props.weapon) {
         const weapon = props.weapon!
 
+        // Generate the correct source for the weapon
         if (process.env.NODE_ENV === 'development') {
             imgSrc = gridImages[weapon.granblue_id]
         } else if (process.env.NODE_ENV === 'production') {
@@ -29,11 +32,21 @@ function WeaponGridUnit(props: WeaponGridProps) {
         'editable': props.editable
     })
 
+    const weapon = props.weapon
+
     return (
         <li>
             <div className={classes} onClick={openModalIfEditable}>
-                <img className="grid_image" src={imgSrc} />
-                { (props.editable) ? <span className='icon'><Plus /></span> : '' }
+                <div className="WeaponGridImage">
+                    <img className="grid_image" src={imgSrc} />
+                    { (props.editable) ? <span className='icon'><Plus /></span> : '' }
+                </div>
+                <UncapIndicator 
+                    ulb={weapon?.uncap.ulb || false} 
+                    flb={weapon?.uncap.flb || false}
+                    uncapLevel={3}
+                />
+                <h3 className="WeaponName">{weapon?.name.en}</h3>
             </div>
             {open ? (
                 <SearchModal