diff --git a/components/product/ProductView/ProductView.module.css b/components/product/ProductView/ProductView.module.css
index 3ee34e54a..8d459b9dc 100644
--- a/components/product/ProductView/ProductView.module.css
+++ b/components/product/ProductView/ProductView.module.css
@@ -1,3 +1,8 @@
 .root {
   @apply flex flex-row h-screen py-12;
 }
+
+.button {
+  @apply py-5 uppercase text-center;
+  min-width: 300px;
+}
diff --git a/components/product/ProductView/ProductView.tsx b/components/product/ProductView/ProductView.tsx
index e5ed41262..b29a2c4d6 100644
--- a/components/product/ProductView/ProductView.tsx
+++ b/components/product/ProductView/ProductView.tsx
@@ -17,10 +17,14 @@ const ProductView: FunctionComponent<Props> = ({ productData, className }) => {
   const rootClassName = cn(s.root, className);
   return (
     <div className={rootClassName}>
-      <div className="absolute h-12">
-        <h1>T-Shirt</h1>
+      <div className="absolute">
+        <h1 className="px-8 py-2 bg-violet text-white font-bold text-3xl">
+          T-Shirt
+        </h1>
+        <div className="px-6 py-2 pb-4 bg-violet text-white font-semibold inline-block">
+          $50
+        </div>
       </div>
-      <div className="absolute h-12">T-Shirt</div>
       <div className="flex-1 h-full p-24">
         <div className="bg-violet h-full"></div>
       </div>
@@ -57,7 +61,7 @@ const ProductView: FunctionComponent<Props> = ({ productData, className }) => {
           <p>{productData.description}</p>
         </section>
         <section className="pb-4">
-          <Button className="">Add to Cart</Button>
+          <Button className={s.button}>Add to Cart</Button>
         </section>
       </div>
     </div>
diff --git a/components/ui/Button/Button.module.css b/components/ui/Button/Button.module.css
index 2244ccb5c..c067e78e8 100644
--- a/components/ui/Button/Button.module.css
+++ b/components/ui/Button/Button.module.css
@@ -1,5 +1,5 @@
 .root {
-  @apply cursor-pointer  inline-flex items-center px-8 py-2 rounded-sm border border-transparent text-base leading-6 text-white bg-black transition ease-in-out duration-150 shadow-sm font-medium;
+  @apply cursor-pointer inline-flex px-8 py-2 rounded-sm border border-transparent leading-6 text-white bg-black transition ease-in-out duration-150 shadow-sm font-medium text-center justify-center;
 }
 
 .root:hover {
@@ -13,3 +13,7 @@
 .root:active {
   @apply bg-gray-700;
 }
+
+s.filled {
+  @apply text-white bg-black;
+}