diff --git a/pages/playground.tsx b/pages/playground.tsx
index bc261a8..0959f8f 100644
--- a/pages/playground.tsx
+++ b/pages/playground.tsx
@@ -18,7 +18,6 @@ import React from "react";
 import { Color } from "utils/Color";
 
 import { About } from "@/components/About";
-import { ComponentWrapper } from "@/components/ComponentWrapper";
 import {
   GroupedBarGraphHorizontal,
   GroupedBarGraphVertical,
@@ -27,7 +26,6 @@ import { LineGraph } from "@/components/LineGraph";
 import { PieChart } from "@/components/PieChart";
 import { QuotationCarousel } from "@/components/QuotationCarousel";
 import { Sections } from "@/components/Sections";
-import { SectionWrapper } from "@/components/SectionWrapper";
 import {
   StackedBarGraphVertical,
   StackedBarGraphHorizontal,
@@ -69,7 +67,18 @@ export default function Home() {
       <h2>
         <code>{"<BarGraphHorizontal />"}</code>
       </h2>
-
+      <BarGraphHorizontal
+        className={styles.barGraphDemo}
+        data={mockCategoricalData}
+        width={800}
+        height={500}
+        margin={{
+          top: 25,
+          bottom: 40,
+          left: 150,
+          right: 20,
+        }}
+      />
 
       <h2>
         <code>{"<BarGraphVertical />"}</code>