diff --git a/fab-ui/index.html b/fab-ui/index.html
index 72320b4..dd65d42 100644
--- a/fab-ui/index.html
+++ b/fab-ui/index.html
@@ -6,10 +6,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>FaB Cards</title>
     <link rel="stylesheet" href="./src/index.css" />
-    <script type="module" src="/src/fab-card.ts"></script>
+    <script type="module" defer src="/src/main.ts"></script>
   </head>
   <body>
     <h2>Card Printings</h2>
+    <h3>Standard Printings</h3>
     <div class="cards-list">
       <fab-card-printing
         setId="ROS152"
@@ -39,9 +40,11 @@
         rarity="R"
       ></fab-card-printing>
     </div>
+    <h3>Dual Printings</h3>
+    <div class="cards-list"></div>
     <h2>Cards Unique Visually</h2>
     <div class="cards-list">
-
+      <fab-card-image setId="ROS152" name="Arcane Cussing"></fab-card-image>
     </div>
   </body>
 </html>
diff --git a/fab-ui/src/fab-card.ts b/fab-ui/src/fab-card.ts
index 3009dda..ef48d76 100644
--- a/fab-ui/src/fab-card.ts
+++ b/fab-ui/src/fab-card.ts
@@ -1,5 +1,6 @@
 import { LitElement, css, html } from 'lit'
 import { customElement, property } from 'lit/decorators.js'
+import { FabCardImage } from './fab-image';
 
 @customElement("fab-rarity-symbol")
 export class FabRaritySymbol extends LitElement {
@@ -65,9 +66,7 @@ export class FabCardPrinting extends LitElement {
     render() {
         return html`
     <div class="card  ${this.foiling != 'S' ? (this.foiling == 'R' ? 'rainbow-foiling' : 'cold-foiling') : ''}">
-        <div class="card-img">
-            <img class="single-card-img" src="http://localhost:8000/p/${this.setId}/w400" alt="${this.name}">
-        </div>
+        <fab-card-image setId="${this.setId}" name="${this.name}"></fab-card-image>
         <div class="card-details">
             <fab-rarity-symbol rarity="${this.rarity}"></fab-rarity-symbol>
             <span class="printing-id">${this.setId}</span>
@@ -86,38 +85,15 @@ export class FabCardPrinting extends LitElement {
         border-radius: 10px;
         box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
     }
-    .card-img {
-        position: relative;
-        width: 100%;
-        height: 0;
-        padding-bottom: 140%;
-    }
     .card-details {
         padding: 10px;
         font-size: 12px;
     }
-    .card-img img {
-        position: absolute;
-        top: 0;
-        left: 0;
-        border-radius: 8px;
-        box-shadow: rgba(0,0,0,0.18) 0px 2px 8px;
-        transition: box-shadow 0.2s, z-index 0.2s, opacity 0.2s;
-    }
-    .card-img img.single-card-img {
-        width: 100%;
-        left: 0;
-        top: 0;
-        position: absolute;
-        transform: none;
-        z-index: 2;
-    }
     .printing-id {
         font-family: "Geist Mono", monospace;
         font-weight: bold;
         color: #666;
     }
-
     .rainbow-foiling .card-name {
         background: linear-gradient(90deg, #ffb347, #ffcc33, #b4ffb3, #b3d1ff, #e0b3ff, #ffb3d1, #ffb347);
         background-size: 200% 200%;
diff --git a/fab-ui/src/fab-image.ts b/fab-ui/src/fab-image.ts
new file mode 100644
index 0000000..f595c54
--- /dev/null
+++ b/fab-ui/src/fab-image.ts
@@ -0,0 +1,43 @@
+import { LitElement, css, html } from 'lit'
+import { customElement, property } from 'lit/decorators.js'
+
+@customElement('fab-card-image')
+export class FabCardImage extends LitElement {
+    @property({ type: String })
+    setId = '';
+    @property({ type: String })
+    name = '';
+
+    render() {
+        return html`
+            <div class="card-img">
+                <img class="single-card-img" src="http://localhost:8000/p/${this.setId}/w400" alt="${this.name}">
+            </div>
+        `;
+    }
+
+    static styles = css`
+    .card-img {
+        position: relative;
+        width: 100%;
+        height: auto;
+        padding-bottom: 140%;
+    }
+    .card-img img {
+        position: absolute;
+        top: 0;
+        left: 0;
+        border-radius: 8px;
+        box-shadow: rgba(0,0,0,0.18) 0px 2px 8px;
+        transition: box-shadow 0.2s, z-index 0.2s, opacity 0.2s;
+    }
+    .card-img img.single-card-img {
+        width: 100%;
+        left: 0;
+        top: 0;
+        position: absolute;
+        transform: none;
+        z-index: 2;
+    }
+    `;
+}
\ No newline at end of file
diff --git a/fab-ui/src/main.ts b/fab-ui/src/main.ts
new file mode 100644
index 0000000..343d34b
--- /dev/null
+++ b/fab-ui/src/main.ts
@@ -0,0 +1,3 @@
+// Main entry for Vite. Import all custom elements here.
+import './fab-card.ts';
+import './fab-image.ts'
\ No newline at end of file
