diff --git a/card.py b/card.py
index fa5e8c1..32a1df0 100644
--- a/card.py
+++ b/card.py
@@ -9,22 +9,26 @@ class Card(Model):
     title = "[[title]]"
     figure = "code"#https://material.io/icons/
     description = "[[description]]"
-    steps = ["Do a", "Then do b"]
-    cost = "[[cost]]"
-    power = "[[power]]"
-    cp = "[[cp]]"
+    steps = []
+    effects = []
+    cost = "free action"
+    power = None
+    cp = None
     flags = []
 
     def has_flag(self, flag): return flag in self.flags
 
 def from_file(filename, in_carddir=True):#yaml syntax
-    os.path.join(config.carddir, filename) if in_carddir else filename
-    ret = Card()
-    ret.filename = ".".join(os.path.basename(filename).split(".")[:-1])
+    name = ".".join(os.path.basename(filename).split(".")[:-1])
     with open(os.path.join(config.carddir, filename) if in_carddir else filename, "r") as f:
-        for key, val in load(f.read()).items():
-            setattr(ret, key, val)
-    return ret
+        return from_yaml(f.read(), name)
+
+def from_yaml(data, filename="from_yaml"):
+    card = Card()
+    card.filename = filename
+    for key, val in load(data).items():
+        setattr(card, key, val)
+    return card
 
 def from_dir(path):
     return [from_file(i, in_carddir=False) for i in glob.glob(os.path.join(path, "*.yaml"))]
diff --git a/resources/cards/card.css b/resources/cards/card.css
index b9d08cc..e6a156b 100644
--- a/resources/cards/card.css
+++ b/resources/cards/card.css
@@ -6,15 +6,17 @@
   size: A4;
   margin: 1.2cm;
 }
+@media print {
+    body {
+        width: 21cm;
+        height: 29.7cm;
+    }
+}
 :root {
     font-family: sans-serif;
     font-size: 3mm;
     font-weight: 300;
 }
-body {
-    width: 21cm;
-    height: 29.7cm;
-}
 
 article {
     margin: 3mm 5mm;
@@ -39,7 +41,15 @@ article {
     border-width: 2mm;
     border-color: #333;
     background-color: #333;
-
+}
+article.effects {
+    grid-template-columns: 4fr 3fr;
+    grid-template-areas:
+        "header header"
+        "figure effects"
+        "cost cost"
+        "info info"
+        "power cp";
 }
 
 article >* {
@@ -71,6 +81,12 @@ article figure .material-icons.figure {
     color: #999;
 }
 
+article ul {
+    grid-area: effects;
+    list-style-type: none;
+    padding: 1mm 0;
+}
+
 article main {
     padding: 2mm 0;
     grid-area: info;
diff --git a/resources/cards/card.vm b/resources/cards/card.vm
index 837269d..5455cd4 100644
--- a/resources/cards/card.vm
+++ b/resources/cards/card.vm
@@ -3,7 +3,7 @@
 <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
 
 #foreach($card in $cards)
-    <article>
+    <article #if($card.effects) class="effects"#end>
         <h1>
             $escape_html($card.title)
         </h1>
@@ -11,13 +11,22 @@
             <!--https://material.io/icons/-->
             <i class="material-icons figure">$escape_html($card.figure)</i>
         </figure>
-        <main>
-            $escape_html($card.description)
-            <ol>
-                #foreach($item in $card.steps)
+        #if($card.effects)
+            <ul>
+                #foreach($item in $card.effects)
                     <li>$escape_html($item)</li>
                 #end
-            </ol>
+            </ul>
+        #end
+        <main>
+            $escape_html($card.description)
+            #if($card.steps)
+                <ol>
+                    #foreach($item in $card.steps)
+                        <li>$escape_html($item)</li>
+                    #end
+                </ol>
+            #end
             #if($card.flags)
                 <div class="bottom">
                     <small>-
@@ -36,7 +45,11 @@
             #end
         </main>
         <div class="cost">$escape_html($card.cost)</div>
-        <div class="power">$escape_html($card.power)</div>
-        <div class="cp">$escape_html($card.cp)</div>
+        #if($card.power)
+            <div class="power">$escape_html($card.power)</div>
+        #end
+        #if($card.power)
+            <div class="cp">$escape_html($card.cp)</div>
+        #end
     </article>
 #end
diff --git a/resources/cards/creator.css b/resources/cards/creator.css
new file mode 100644
index 0000000..9053055
--- /dev/null
+++ b/resources/cards/creator.css
@@ -0,0 +1,8 @@
+iframe {
+    width: 8cm;
+    height: 12cm;
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+}
diff --git a/resources/cards/creator.vm b/resources/cards/creator.vm
new file mode 100644
index 0000000..48e9a8f
--- /dev/null
+++ b/resources/cards/creator.vm
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<link rel="stylesheet" href="creator.css">
+<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
+
+<iframe name="preview"></iframe>
+
+<form action="preview" method="post" target="preview">
+    Title:
+    <input type="text" name="title"><br>
+
+    Figure:
+    <input type="text" name="figure"><br>
+
+    Description:
+    <input type="text" name="description"><br>
+
+    Steps:
+    <input type="text" name="steps"><br>
+
+    Effects:
+    <input type="text" name="effects"><br>
+
+    Cost:
+    <input type="text" name="cost"><br>
+
+    Power
+    <input type="text" name="power"><br>
+
+    CP:
+    <input type="text" name="cp"><br>
+
+    Flags:
+    <input type="text" name="flags"><br>
+
+    <br>
+    <input type="submit" value="preview">
+</form>
diff --git a/server.py b/server.py
index 4cabba8..384df80 100755
--- a/server.py
+++ b/server.py
@@ -18,6 +18,11 @@ async def show_cardlist(request, template={}):
 
     return response.html(template["cardlist.vm"].merge(locals()))
 
+@app.get('/cards/creator')
+@withTemplate("cards/creator.vm")
+async def preview_card(request, template={}):
+    return response.html(template["creator.vm"].merge(locals()))
+
 @app.get('/cards/show')
 @withTemplate("cards/card.vm")
 async def show_cards(request, template={}):
@@ -31,6 +36,19 @@ async def show_cards(request, template={}):
         cards.append(card.from_file(i+".yaml"))
     return response.html(template["card.vm"].merge(locals()))
 
+@app.post('/cards/preview')
+@withTemplate("cards/card.vm")
+async def preview_card(request, template={}):
+    cards = [card.Card()]
+
+    for key, val in request.form.items():
+        if not val[0]: continue
+        if type(getattr(card.Card, key)) in (tuple, list):
+            setattr(cards[0], key, val)
+        else:
+            setattr(cards[0], key, val[0])
+
+    return response.html(template["card.vm"].merge(locals()))
 
 #add static files:
 for i in glob.iglob(os.path.join(config.resourcedir, "**","*"), recursive=True):