From 173f11dc3119c842a58daa9d1e0afc67eeb0e4e8 Mon Sep 17 00:00:00 2001
From: Benjamin Auder <benjamin.auder@somewhere>
Date: Sun, 3 Jan 2021 15:50:27 +0100
Subject: [PATCH] Early draft of Paco-Sako + some fixes

---
 LICENSE                                       |   2 +-
 client/public/images/pieces/Janggi/ba.svg     | 323 +++++++++++++++
 client/public/images/pieces/Janggi/bc.svg     | 385 ++++++++++++++++++
 client/public/images/pieces/Janggi/be.svg     | 298 ++++++++++++++
 client/public/images/pieces/Janggi/bk.svg     | 347 ++++++++++++++++
 client/public/images/pieces/Janggi/bn.svg     | 300 ++++++++++++++
 client/public/images/pieces/Janggi/bp.svg     | 293 +++++++++++++
 client/public/images/pieces/Janggi/br.svg     | 378 +++++++++++++++++
 client/public/images/pieces/Janggi/wa.svg     | 323 +++++++++++++++
 client/public/images/pieces/Janggi/wc.svg     | 385 ++++++++++++++++++
 client/public/images/pieces/Janggi/we.svg     | 298 ++++++++++++++
 client/public/images/pieces/Janggi/wk.svg     | 347 ++++++++++++++++
 client/public/images/pieces/Janggi/wn.svg     | 300 ++++++++++++++
 client/public/images/pieces/Janggi/wp.svg     | 293 +++++++++++++
 client/public/images/pieces/Janggi/wr.svg     | 378 +++++++++++++++++
 client/public/images/pieces/Jiangqi/ba.svg    |   1 -
 client/public/images/pieces/Jiangqi/bc.svg    |   1 -
 client/public/images/pieces/Jiangqi/be.svg    |   1 -
 client/public/images/pieces/Jiangqi/bk.svg    |   1 -
 client/public/images/pieces/Jiangqi/bn.svg    |   1 -
 client/public/images/pieces/Jiangqi/bp.svg    |   1 -
 client/public/images/pieces/Jiangqi/br.svg    |   1 -
 client/public/images/pieces/Jiangqi/wa.svg    |   1 -
 client/public/images/pieces/Jiangqi/wc.svg    |   1 -
 client/public/images/pieces/Jiangqi/we.svg    |   1 -
 client/public/images/pieces/Jiangqi/wk.svg    |   1 -
 client/public/images/pieces/Jiangqi/wn.svg    |   1 -
 client/public/images/pieces/Jiangqi/wp.svg    |   1 -
 client/public/images/pieces/Jiangqi/wr.svg    |   1 -
 client/public/images/pieces/Pacosako/bb.png   |   1 +
 client/public/images/pieces/Pacosako/bc.png   |   1 +
 client/public/images/pieces/Pacosako/bd.png   |   1 +
 client/public/images/pieces/Pacosako/be.png   |   1 +
 client/public/images/pieces/Pacosako/bf.png   |   1 +
 client/public/images/pieces/Pacosako/bg.png   |   1 +
 client/public/images/pieces/Pacosako/bi.png   |   1 +
 client/public/images/pieces/Pacosako/bj.png   |   1 +
 client/public/images/pieces/Pacosako/bk.png   |   1 +
 client/public/images/pieces/Pacosako/bl.png   |   1 +
 client/public/images/pieces/Pacosako/bm.png   |   1 +
 client/public/images/pieces/Pacosako/bn.png   |   1 +
 client/public/images/pieces/Pacosako/bp.png   |   1 +
 client/public/images/pieces/Pacosako/bq.png   |   1 +
 client/public/images/pieces/Pacosako/br.png   |   1 +
 client/public/images/pieces/Pacosako/bs.png   |   1 +
 client/public/images/pieces/Pacosako/bt.png   |   1 +
 client/public/images/pieces/Pacosako/bu.png   |   1 +
 client/public/images/pieces/Pacosako/bw.png   |   1 +
 client/public/images/pieces/Pacosako/bx.png   |   1 +
 client/public/images/pieces/Pacosako/bz.png   |   1 +
 .../public/images/pieces/Pacosako/script.sh   |  15 +
 client/public/images/pieces/Pacosako/wa.png   |   1 +
 client/public/images/pieces/Pacosako/wb.png   |   1 +
 client/public/images/pieces/Pacosako/wc.png   |   1 +
 client/public/images/pieces/Pacosako/wd.png   |   1 +
 client/public/images/pieces/Pacosako/we.png   |   1 +
 client/public/images/pieces/Pacosako/wf.png   |   1 +
 client/public/images/pieces/Pacosako/wg.png   |   1 +
 client/public/images/pieces/Pacosako/wh.png   |   1 +
 client/public/images/pieces/Pacosako/wi.png   |   1 +
 client/public/images/pieces/Pacosako/wj.png   |   1 +
 client/public/images/pieces/Pacosako/wk.png   |   1 +
 client/public/images/pieces/Pacosako/wl.png   |   1 +
 client/public/images/pieces/Pacosako/wm.png   |   1 +
 client/public/images/pieces/Pacosako/wn.png   |   1 +
 client/public/images/pieces/Pacosako/wo.png   |   1 +
 client/public/images/pieces/Pacosako/wp.png   |   1 +
 client/public/images/pieces/Pacosako/wq.png   |   1 +
 client/public/images/pieces/Pacosako/wr.png   |   1 +
 client/public/images/pieces/Pacosako/ws.png   |   1 +
 client/public/images/pieces/Pacosako/wt.png   |   1 +
 client/public/images/pieces/Pacosako/wu.png   |   1 +
 client/public/images/pieces/Pacosako/wv.png   |   1 +
 client/public/images/pieces/Pacosako/ww.png   |   1 +
 client/public/images/pieces/Pacosako/wx.png   |   1 +
 client/public/images/pieces/Pacosako/wy.png   |   1 +
 client/public/images/pieces/Pacosako/wz.png   |   1 +
 client/src/base_rules.js                      |  24 +-
 client/src/components/Board.vue               |   2 +-
 client/src/translations/en.js                 |   1 +
 client/src/translations/es.js                 |   1 +
 client/src/translations/faq/en.pug            |   2 +-
 client/src/translations/fr.js                 |   1 +
 .../src/translations/rules/Checkered1/en.pug  |   2 +-
 client/src/translations/rules/Pacosako/en.pug |  13 +
 client/src/translations/rules/Pacosako/es.pug |  13 +
 client/src/translations/rules/Pacosako/fr.pug |  13 +
 client/src/translations/variants/en.pug       |   1 +
 client/src/variants/Janggi.js                 |   2 +-
 client/src/variants/Pacosako.js               | 336 +++++++++++++++
 server/db/populate.sql                        |   1 +
 91 files changed, 5107 insertions(+), 31 deletions(-)
 create mode 100644 client/public/images/pieces/Janggi/ba.svg
 create mode 100644 client/public/images/pieces/Janggi/bc.svg
 create mode 100644 client/public/images/pieces/Janggi/be.svg
 create mode 100644 client/public/images/pieces/Janggi/bk.svg
 create mode 100644 client/public/images/pieces/Janggi/bn.svg
 create mode 100644 client/public/images/pieces/Janggi/bp.svg
 create mode 100644 client/public/images/pieces/Janggi/br.svg
 create mode 100644 client/public/images/pieces/Janggi/wa.svg
 create mode 100644 client/public/images/pieces/Janggi/wc.svg
 create mode 100644 client/public/images/pieces/Janggi/we.svg
 create mode 100644 client/public/images/pieces/Janggi/wk.svg
 create mode 100644 client/public/images/pieces/Janggi/wn.svg
 create mode 100644 client/public/images/pieces/Janggi/wp.svg
 create mode 100644 client/public/images/pieces/Janggi/wr.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/ba.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/bc.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/be.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/bk.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/bn.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/bp.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/br.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/wa.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/wc.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/we.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/wk.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/wn.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/wp.svg
 delete mode 120000 client/public/images/pieces/Jiangqi/wr.svg
 create mode 120000 client/public/images/pieces/Pacosako/bb.png
 create mode 100644 client/public/images/pieces/Pacosako/bc.png
 create mode 100644 client/public/images/pieces/Pacosako/bd.png
 create mode 100644 client/public/images/pieces/Pacosako/be.png
 create mode 100644 client/public/images/pieces/Pacosako/bf.png
 create mode 100644 client/public/images/pieces/Pacosako/bg.png
 create mode 100644 client/public/images/pieces/Pacosako/bi.png
 create mode 100644 client/public/images/pieces/Pacosako/bj.png
 create mode 120000 client/public/images/pieces/Pacosako/bk.png
 create mode 100644 client/public/images/pieces/Pacosako/bl.png
 create mode 100644 client/public/images/pieces/Pacosako/bm.png
 create mode 120000 client/public/images/pieces/Pacosako/bn.png
 create mode 120000 client/public/images/pieces/Pacosako/bp.png
 create mode 120000 client/public/images/pieces/Pacosako/bq.png
 create mode 120000 client/public/images/pieces/Pacosako/br.png
 create mode 100644 client/public/images/pieces/Pacosako/bs.png
 create mode 100644 client/public/images/pieces/Pacosako/bt.png
 create mode 100644 client/public/images/pieces/Pacosako/bu.png
 create mode 100644 client/public/images/pieces/Pacosako/bw.png
 create mode 100644 client/public/images/pieces/Pacosako/bx.png
 create mode 100644 client/public/images/pieces/Pacosako/bz.png
 create mode 100644 client/public/images/pieces/Pacosako/script.sh
 create mode 100644 client/public/images/pieces/Pacosako/wa.png
 create mode 120000 client/public/images/pieces/Pacosako/wb.png
 create mode 100644 client/public/images/pieces/Pacosako/wc.png
 create mode 100644 client/public/images/pieces/Pacosako/wd.png
 create mode 100644 client/public/images/pieces/Pacosako/we.png
 create mode 100644 client/public/images/pieces/Pacosako/wf.png
 create mode 100644 client/public/images/pieces/Pacosako/wg.png
 create mode 100644 client/public/images/pieces/Pacosako/wh.png
 create mode 100644 client/public/images/pieces/Pacosako/wi.png
 create mode 100644 client/public/images/pieces/Pacosako/wj.png
 create mode 120000 client/public/images/pieces/Pacosako/wk.png
 create mode 100644 client/public/images/pieces/Pacosako/wl.png
 create mode 100644 client/public/images/pieces/Pacosako/wm.png
 create mode 120000 client/public/images/pieces/Pacosako/wn.png
 create mode 100644 client/public/images/pieces/Pacosako/wo.png
 create mode 120000 client/public/images/pieces/Pacosako/wp.png
 create mode 120000 client/public/images/pieces/Pacosako/wq.png
 create mode 120000 client/public/images/pieces/Pacosako/wr.png
 create mode 100644 client/public/images/pieces/Pacosako/ws.png
 create mode 100644 client/public/images/pieces/Pacosako/wt.png
 create mode 100644 client/public/images/pieces/Pacosako/wu.png
 create mode 100644 client/public/images/pieces/Pacosako/wv.png
 create mode 100644 client/public/images/pieces/Pacosako/ww.png
 create mode 100644 client/public/images/pieces/Pacosako/wx.png
 create mode 100644 client/public/images/pieces/Pacosako/wy.png
 create mode 100644 client/public/images/pieces/Pacosako/wz.png
 create mode 100644 client/src/translations/rules/Pacosako/en.pug
 create mode 100644 client/src/translations/rules/Pacosako/es.pug
 create mode 100644 client/src/translations/rules/Pacosako/fr.pug
 create mode 100644 client/src/variants/Pacosako.js

diff --git a/LICENSE b/LICENSE
index 289bbb7d..921041d0 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,4 +1,4 @@
-Copyright 2018-2020 Benjamin Auder
+Copyright 2018-2021 Benjamin Auder
 
 Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
 
diff --git a/client/public/images/pieces/Janggi/ba.svg b/client/public/images/pieces/Janggi/ba.svg
new file mode 100644
index 00000000..3f76d5ab
--- /dev/null
+++ b/client/public/images/pieces/Janggi/ba.svg
@@ -0,0 +1,323 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_advisor.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="10.488889"
+     inkscape:cx="45.657747"
+     inkscape:cy="57.533384"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g11207"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.2229935,0,0,1.2229935,-262.19742,-790.48598)"
+       id="g3006">
+      <g
+         id="g11207"
+         transform="matrix(1.15,0,0,1.15,-37.800375,-102.5949)">
+        <g
+           id="XMLID_56_"
+           style="stroke:none">
+          <g
+             id="g2976"
+             style="stroke:none">
+            <polygon
+               id="polygon2968"
+               points="268.852,675.453 268.852,689.412 268.819,689.441 258.98,699.281 245.063,699.281 245.023,699.281 235.153,689.412 235.153,675.453 245.023,665.586 258.98,665.586 "
+               style="fill:#ffffff;stroke:none" />
+            <polygon
+               id="polygon2970"
+               points="258.98,702.309 258.98,699.324 258.98,699.281 268.819,689.441 268.822,689.443 268.822,692.539 268.842,692.557 259.091,702.309 "
+               style="fill:#bcbab8;stroke:none" />
+            <polygon
+               id="polygon2972"
+               points="258.98,702.309 258.98,702.346 258.951,702.346 245.068,702.346 245.063,702.346 245.063,702.271 245.063,699.324 245.063,699.281 258.98,699.281 258.98,699.324 "
+               style="fill:#cecac8;stroke:none" />
+            <polygon
+               id="polygon2974"
+               points="235.153,692.426 235.153,689.412 245.023,699.281 245.063,699.281 245.063,699.324 245.063,702.271 244.998,702.271 "
+               style="fill:#e2e1e0;stroke:none" />
+          </g>
+          <g
+             id="g2994"
+             style="stroke:none">
+            <polygon
+               id="polygon2978"
+               points="245.063,699.281 245.023,699.281 235.153,689.412 235.153,675.453 245.023,665.586 258.98,665.586 268.852,675.453 268.852,689.412 268.819,689.441 258.98,699.281 "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <polyline
+               id="polyline2980"
+               points="235.153,689.412 235.153,692.426 235.153,692.504    "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <polyline
+               id="polyline2982"
+               points="245.063,699.324 245.063,702.271 245.063,702.346      245.063,702.414    "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <polyline
+               id="polyline2984"
+               points="258.98,699.324 258.98,702.309 258.98,702.346      258.98,702.414    "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <line
+               id="line2986"
+               y2="692.539"
+               x2="268.82199"
+               y1="689.44299"
+               x1="268.82199"
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+            <polyline
+               id="polyline2988"
+               points="235.123,692.396 235.153,692.426 244.998,702.271    "
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+            <polyline
+               id="polyline2990"
+               points="259.091,702.309 268.842,692.557 268.877,692.521    "
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+            <line
+               id="line2992"
+               y2="702.34601"
+               x2="258.95099"
+               y1="702.34601"
+               x1="245.06799"
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+          </g>
+        </g>
+        <g
+           transform="matrix(0.61265816,0,0,0.61265816,223.70484,655.33548)"
+           id="g16676"
+           style="display:inline">
+          <g
+             transform="translate(0,3.4415459e-6)"
+             id="g19024">
+            <path
+               sodipodi:nodetypes="cccc"
+               inkscape:connector-curvature="0"
+               id="path8722-0"
+               d="m 53.380882,55.673609 c -0.109046,-1.025935 0.510246,-3.474635 3.77523,-3.606694 1.749162,-3.263349 4.571668,-3.176384 6.53924,0 1.89631,0.17075 3.401249,0.839608 3.337034,3.505572"
+               style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.60000002;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cccccccccccc"
+               inkscape:connector-curvature="0"
+               id="path7039"
+               d="M 46.314318,54.9317 C 42.356998,54.834892 38.28061,55.053577 33.042662,54.572582 29.08398,51.239218 24.163206,34.895196 26.264735,27.515155 l 2.242968,5.073731 c 0.904414,-1.286503 4.443742,-3.043957 5.826002,-0.651772 3.063224,-2.067575 3.965642,-1.47325 6.167862,-0.446321 2.326036,-1.963969 3.759013,-1.686422 5.584723,-0.208555 2.435106,-1.540839 2.91277,-2.315498 5.969919,-0.234576 1.393794,-1.805529 5.348995,-1.238852 6.514895,0.63516 0.72922,-1.449764 3.882256,-1.601314 5.129111,0.705381 l 2.779908,-5.008547 c 1.69577,7.471841 -3.140965,24.150404 -6.983188,27.080935"
+               style="fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1.05248582;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="ccccccc"
+               inkscape:connector-curvature="0"
+               id="path7043"
+               d="m 33.042662,54.221383 c -0.04538,3.440549 0.535511,6.221829 1.46304,9.662379 4.266942,1.897027 7.563074,2.10954 11.478298,2.199874 3.915225,-0.07254 8.300478,-0.65405 11.865019,-2.300217 0.92753,-3.44055 1.712825,-6.121487 1.667438,-9.562036 l -13.213668,0.452419 z"
+               style="fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:0.56941742;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7051"
+               d="m 34.248108,31.144819 c 0.161876,7.627342 2.186141,16.283659 4.225636,23.508654"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7053"
+               d="M 58.487159,30.379647 C 57.905091,37.947181 56.903213,47.41971 54.483762,54.462278"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7088"
+               d="M 52.145463,29.521685 C 51.563396,37.089219 51.450918,46.10004 49.382667,53.242951"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="m 40.524586,30.501832 c 0.161876,7.627343 0.823654,15.521191 2.863149,22.746186"
+               id="path7090"
+               inkscape:connector-curvature="0"
+               sodipodi:nodetypes="cc" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7092"
+               d="M 46.225032,53.395931 46.124215,30.697163"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               style="fill:none;stroke:#ffffff;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="M 32.779521,55.723468 C 43.040852,53.07175 52.284118,54.00966 60.026058,55.823812"
+               id="path7094"
+               inkscape:connector-curvature="0"
+               sodipodi:nodetypes="cc" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7096"
+               d="m 33.649764,63.258142 c 9.702633,-2.248555 17.829672,-1.559126 24.853754,-0.200528"
+               style="fill:none;stroke:#ffffff;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <circle
+               r="1.4591321"
+               cy="58.035988"
+               cx="46.108307"
+               id="path7098"
+               style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.56941742;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7051-0"
+               d="m 29.471433,30.206797 c -1.317204,7.565714 2.169353,17.040115 4.945284,24.295795"
+               style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="m 63.310845,30.432888 c 1.317204,7.565714 -2.544353,16.790115 -5.320284,24.045795"
+               id="path7645"
+               inkscape:connector-curvature="0"
+               sodipodi:nodetypes="cc" />
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/bc.svg b/client/public/images/pieces/Janggi/bc.svg
new file mode 100644
index 00000000..f6ef21df
--- /dev/null
+++ b/client/public/images/pieces/Janggi/bc.svg
@@ -0,0 +1,385 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_cannon.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+    <filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter19100">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood19090" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite19092" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur19094" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset19096" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite19098" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.6568543"
+     inkscape:cx="19.432824"
+     inkscape:cy="27.395539"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22206,-4.6324664)"
+       id="g2170">
+      <g
+         id="XMLID_19_">
+        <g
+           id="g2144">
+          <polygon
+             style="fill:#ffffff"
+             points="458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8"
+             points="491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 491.291,43.542 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8"
+             points="458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 458.395,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0"
+             points="458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 458.395,57.218 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <path
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.17765069px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 39.650096,37.52813 c -0.802875,-0.297661 -1.025097,0.33772 -1.413181,0.706591 0.07326,0.454377 -0.153118,0.660483 0.706591,1.766476 0.74762,0.26103 1.67449,0.05801 2.590832,-0.117766 0.993124,0.170775 1.535409,0.566965 2.119771,0.94212 -0.07396,-0.805693 -0.531427,-1.444819 -1.177651,-2.002005 z"
+       id="path5363"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccc" />
+    <path
+       style="fill:#ffffff;stroke:none;stroke-width:1.17950511;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 40.121157,36.114949 c -0.96817,0.118061 -1.582139,0.513092 -2.002006,1.059886 0.376412,-0.01155 0.771314,-0.03236 1.295415,-0.117765 0.956252,-0.844649 1.539884,-0.332521 2.237536,-0.23553 -0.404039,-0.270953 -0.90248,-0.510445 -1.530945,-0.706591 z"
+       id="path5365"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccc" />
+    <g
+       style="display:inline"
+       id="g5204"
+       transform="matrix(-0.98743104,0,0,0.98743104,853.03365,-233.12)">
+      <g
+         transform="matrix(0.42429161,0,0,0.35530383,319.4593,167.8082)"
+         id="g4916">
+        <g
+           id="g873"
+           transform="matrix(0.91849155,-0.04088349,0.02866942,0.91849155,95.269582,54.832886)">
+          <path
+             id="path47"
+             d="m 1213.6335,288.03625 -92.5944,36.18456 c 0,0 -8.0242,8.93392 -2.8931,21.42532 l 0.063,0.30499 0.063,0.30498 c 4.9395,12.5585 16.4998,12.34665 16.4998,12.34665 37.098,-28.13428 66.1489,-38.4485 87.024,-50.31774 -0.192,-4.06467 -1.8458,-7.47907 -2.8249,-11.1936 -1.3824,-3.19489 -2.9322,-6.31529 -5.3374,-9.05516 z"
+             style="fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:2.65330386;stroke-miterlimit:10;stroke-opacity:1"
+             inkscape:connector-curvature="0"
+             sodipodi:nodetypes="ccccccccc" />
+          <ellipse
+             transform="matrix(0.95110508,-0.30886749,0.22204229,0.97503704,0,0)"
+             ry="3.6617434"
+             rx="3.753881"
+             stroke-miterlimit="10"
+             cx="1017.132"
+             cy="677.90155"
+             id="circle53"
+             style="fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:3.00610209;stroke-miterlimit:10;stroke-opacity:1" />
+        </g>
+        <path
+           style="opacity:1;fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:1.83159566;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           d="m 1188.053,314.76933 -0.1997,22.82133 -37.6537,4.53206 c -16.1431,26.71247 -25.0217,28.93186 -41.2475,19.47896 18.33,-6.79184 27.9258,-27.84095 38.5459,-46.51534 z"
+           id="rect875"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="cccccc" />
+        <ellipse
+           style="opacity:1;fill:#dd1f26;fill-opacity:1;stroke:#ffffff;stroke-width:1.99324226;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="path869"
+           transform="matrix(-0.99442868,-0.10541155,-0.07412913,0.99724865,0,0)"
+           ry="32.340363"
+           rx="27.158773"
+           cy="214.17735"
+           cx="-1207.3654" />
+        <ellipse
+           style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:2.05792236;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="path890"
+           cx="1184.762"
+           cy="340.7244"
+           rx="17.729818"
+           ry="21.17234" />
+        <rect
+           style="display:inline;opacity:1;fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:2.22107673;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="rect892-1"
+           width="2.9200215"
+           height="41.437584"
+           x="-684.76074"
+           y="1132.5303"
+           transform="matrix(-0.62961158,0.77691007,0.65434208,0.75619868,0,0)" />
+        <rect
+           transform="matrix(-0.65516628,-0.75548471,-0.62877406,0.77758805,0,0)"
+           y="-703.56848"
+           x="-1155.4326"
+           height="41.684681"
+           width="2.9027057"
+           id="rect909"
+           style="opacity:1;fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:2.2210741;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
+        <rect
+           transform="matrix(0.0023305,0.99999728,0.99999448,-0.00332335,0,0)"
+           y="1165.2843"
+           x="343.79016"
+           height="37.732437"
+           width="3.156975"
+           id="rect911"
+           style="display:inline;opacity:1;fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:2.2037704;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
+        <rect
+           style="opacity:1;fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:2.20377064;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="rect913"
+           width="2.6436777"
+           height="45.058598"
+           x="-1184.9684"
+           y="323.77573"
+           transform="matrix(-0.99998924,0.00463819,0.00325253,0.99999471,0,0)" />
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/be.svg b/client/public/images/pieces/Janggi/be.svg
new file mode 100644
index 00000000..3b8262e3
--- /dev/null
+++ b/client/public/images/pieces/Janggi/be.svg
@@ -0,0 +1,298 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_elephant.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="7.9999999"
+     inkscape:cx="29.929663"
+     inkscape:cy="41.430502"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22334,-4.5642535)"
+       id="g2170"
+       style="stroke:none">
+      <g
+         id="XMLID_19_"
+         style="stroke:none">
+        <g
+           id="g2144"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="491.291,43.542 491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="458.395,61.402 458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="458.395,57.218 458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <g
+       style="display:inline"
+       id="g5374"
+       transform="matrix(1.1776506,0,0,1.1776506,-54.132169,3.9567062)">
+      <g
+         transform="translate(-35.93211,25.548233)"
+         style="opacity:1"
+         id="g5357">
+        <path
+           style="fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="m 125.66609,-2.121176 -3.2,5 -0.6,2.1 c -0.0945,1.5296586 0.15617,2.8292194 0.6,4 l -0.2,2.099999 c -1.09796,3.097738 -2.35981,6.067197 -2.60001,9.5 0.12511,0.773672 0.40427,1.44388 1.3,1.7 11.23011,-0.424319 16.82956,-5.233235 20.30001,-11.7 l 0.2,-2.099999 c -2.10707,-8.89280401 -8.15113,-13.4502442 -16.2,-15.8 -4.40015,-0.5317426 -7.59668,1.3815851 -10.20001,4.5 -2.59354,2.64077835 -4.39616,5.9439949 -5.3,10 -0.89646,1.6487885 -1.64452,1.9405129 -2.4,2.3 -2.28978,-0.6407124 -3.03862,-1.6262894 -2.5,-2.9 0.35259,-1.8089896 3.48816,-3.3504905 5.5,-5 1.59764,-2.6483718 2.34637,-5.1951958 -0.6,-7.3 -8.75831,-2.0518262 -7.05798,4.7061225 -5.2,6.20000004 1.23982,-0.5457366 2.00197,-1.22280981 2.4,-2.00000004 -0.25951,-0.4357328 -0.98217,-0.8162564 0,-1.4 0.5387,0.045976 0.81918,0.2856122 1,0.6 0,1 0.50403,1.1455069 -3.6,4 -2.41796,1.1605474 -2.59331,2.9892138 -3.5,4.6 -1.668162,8.737445 1.94976,11.358136 6.5,12.899999 0.86488,-0.721198 1.12021,-1.741094 1.5,-2.7 1.29573,0.281592 2.51468,0.385517 4.3,1.8 0.43333,-0.4 0.86667,-0.8 1.3,-1.2 l 1.1,0.5 -0.9,0.5 c -0.61971,0.861505 -1.43108,1.608021 -2.5,2.2 l 2.4,0.3 c 1.087,-0.403589 1.93334,-1.017048 2.7,-1.7 l 1.3,-0.4 c 1.21385,-2.971538 2.39138,-5.952154 2.9,-9.099999 -0.0806,-0.9844358 -0.10227,-1.7702685 -0.7,-4.5 l 0.7,-2.3 z"
+           id="path5349"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="cccccccccccccccccccccccccccccccccccc" />
+        <path
+           style="fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="m 109.56608,17.578823 c -1.32838,4.066443 -4.04985,6.321863 -6.6,8.8 -0.20576,0.304421 0.14574,0.397532 1,0.3 3.90473,-1.863513 6.85963,-4.360243 8.1,-8 -0.78642,-0.41302 -1.31194,-1.08384 -2.5,-1.1 z"
+           id="path5353"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ccccc" />
+      </g>
+      <path
+         sodipodi:nodetypes="ccccccc"
+         inkscape:connector-curvature="0"
+         id="path5363"
+         d="m 79.63397,28.56504 c -0.68176,-0.252758 -0.87046,0.286775 -1.2,0.6 0.0622,0.385834 -0.13002,0.560848 0.6,1.5 0.63484,0.221654 1.42189,0.04926 2.2,-0.1 0.84331,0.145013 1.30379,0.481437 1.8,0.8 -0.0628,-0.684154 -0.45126,-1.226866 -1,-1.7 z"
+         style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path5365"
+         d="m 80.03397,27.36504 c -0.82212,0.100251 -1.34347,0.435691 -1.7,0.9 0.31963,-0.0098 0.65496,-0.02748 1.1,-0.1 0.812,-0.717231 1.30759,-0.282359 1.9,-0.2 -0.34309,-0.230079 -0.76634,-0.433443 -1.3,-0.6 z"
+         style="fill:#ffffff;stroke:none;stroke-width:1.00157475;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/bk.svg b/client/public/images/pieces/Janggi/bk.svg
new file mode 100644
index 00000000..38cfda5a
--- /dev/null
+++ b/client/public/images/pieces/Janggi/bk.svg
@@ -0,0 +1,347 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_king.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.2444445"
+     inkscape:cx="-24.49702"
+     inkscape:cy="56.359783"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g17436"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.1618787,0,0,1.1618787,-330.4487,-79.4829)"
+       id="g3316"
+       style="stroke:none">
+      <g
+         id="XMLID_18_"
+         style="stroke:none">
+        <g
+           id="g3290"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="309.854,139.159 309.771,139.159 289.65,119.037 289.65,90.573 309.771,70.451 338.232,70.451 358.357,90.573 358.357,119.037 358.293,119.102 338.232,139.159 "
+             id="polygon3282" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="358.342,125.456 338.459,145.334 338.232,145.334 338.232,139.245 338.232,139.159 358.293,119.102 358.299,119.105 358.299,125.413 "
+             id="polygon3284" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="309.854,145.406 309.854,145.261 309.854,139.245 309.854,139.159 338.232,139.159 338.232,139.245 338.232,145.334 338.232,145.406 338.176,145.406 309.867,145.406 "
+             id="polygon3286" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="289.65,125.186 289.65,119.037 309.771,139.159 309.854,139.159 309.854,139.245 309.854,145.261 309.725,145.261 "
+             id="polygon3288" />
+        </g>
+        <g
+           id="g3308"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="309.771,70.451 338.232,70.451 358.357,90.573 358.357,119.037 358.293,119.102 338.232,139.159 309.854,139.159 309.771,139.159 289.65,119.037 289.65,90.573 "
+             id="polygon3292" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="289.65,119.037 289.65,125.186 289.65,125.34    "
+             id="polyline3294" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="309.854,139.245 309.854,145.261 309.854,145.406      309.854,145.549    "
+             id="polyline3296" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="338.232,139.245 338.232,145.334 338.232,145.406      338.232,145.549    "
+             id="polyline3298" />
+          <line
+             style="fill:#000000;stroke:none;stroke-width:0.30000001;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="358.29901"
+             y1="119.105"
+             x2="358.29901"
+             y2="125.413"
+             id="line3300" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="289.59,125.125 289.65,125.186 309.725,145.261    "
+             id="polyline3302" />
+          <polyline
+             style="fill:#000000;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="338.459,145.334 358.342,125.456 358.41,125.383    "
+             id="polyline3304" />
+          <line
+             style="fill:#000000;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="309.867"
+             y1="145.40601"
+             x2="338.17599"
+             y2="145.40601"
+             id="line3306" />
+        </g>
+      </g>
+    </g>
+    <g
+       id="g17436"
+       transform="matrix(0.855,0,0,0.855,94.978815,-3.2724128)">
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8722-0"
+         d="m -46.436313,67.627388 c -0.165607,-1.558081 0.774903,-5.276887 5.733388,-5.477429 2.656427,-4.956003 6.942927,-4.823938 9.93105,0 2.879899,0.259315 5.165429,1.275088 5.067906,5.323859"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.91121149;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path7039"
+         d="m -57.320805,72.679341 c -6.587623,-0.161148 -13.373454,0.202897 -22.092897,-0.5978 -4.644875,-6.629519 -11.648069,-30.617494 -10.013333,-41.867478 12.35247,-7.523857 56.13743,-9.504467 63.13627,0.250568 1.634736,11.249969 -4.440486,34.800972 -9.085364,41.430476"
+         style="display:inline;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1.75203907;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccccc"
+         inkscape:connector-curvature="0"
+         id="path7043"
+         d="m -79.413702,71.496908 c -0.07556,5.727374 0.891447,10.357269 2.435475,16.084643 7.103041,3.157925 12.590005,3.511688 19.107551,3.662068 6.51755,-0.120736 13.817539,-1.088776 19.751315,-3.829093 1.544028,-5.727374 2.851285,-10.190244 2.775729,-15.917618 l -21.996365,0.753131 z"
+         style="display:inline;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:0.94789076;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path7068"
+         d="m -80.415928,73.716923 c 15.363356,-4.076776 31.908131,-4.078431 45.984826,0.08353"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path7088"
+         d="m -50.837732,39.297444 -3.457918,17.89718"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:2.27802849;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:2.27802849;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -63.933796,40.206332 2.606055,16.511744"
+         id="path7090"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cc" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path7096"
+         d="m -78.403079,86.775676 c 16.151659,-3.74309 29.680479,-2.595419 41.373241,-0.333807"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <ellipse
+         cy="77.338402"
+         cx="-57.830784"
+         id="path7098"
+         style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.46574509;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         rx="3.6733813"
+         ry="3.8404188" />
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8714"
+         d="m -89.936897,29.767797 c 4.604116,13.481814 9.450029,9.250497 10.494288,10.984548 1.212388,3.873044 6.257555,29.772983 6.257555,29.772983 l 0.250556,1.25278"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -25.668126,29.295334 c -4.604116,13.481829 -8.387009,9.132389 -9.431269,10.86644 -1.212388,3.873043 -7.320574,29.891091 -7.320574,29.891091 l -0.250556,1.252779"
+         id="path8716"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccc" />
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8718"
+         d="m -79.419391,40.533776 c 8.133783,-7.708439 11.870546,-1.755373 15.952094,-0.501106 3.267322,-2.941816 6.587792,-6.207263 12.867369,-0.367446 4.426071,-4.312065 11.345369,-4.308663 15.612545,0.367446"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8722"
+         d="m -70.62886,70.802899 c 0.500416,-3.591616 -0.90907,-9.390718 7.547935,-10.748043 2.791835,-6.768023 7.378407,-7.251421 10.80662,0 4.442754,2.044029 6.941217,0.989606 7.301389,10.698959"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cccccccc"
+         inkscape:connector-curvature="0"
+         id="path8751"
+         d="m -91.830501,35.622938 c 0.68816,2.110351 2.863883,7.751205 5.281951,6.204864 1.241032,2.427635 2.591671,2.992297 4.155675,1.645906 -1.241799,2.046475 -1.311549,3.799631 0.918707,5.178172 -0.283632,2.665066 -0.889154,4.713591 1.419819,6.514463 -0.810825,3.215772 -0.284257,4.646176 1.46158,6.305675 -1.150634,1.892525 -0.795712,4.965631 1.37806,5.971593 -0.433679,1.794115 -1.260043,3.90521 2.75612,4.301222"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5186857;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5186857;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -22.736654,35.472452 c -0.688161,2.11035 -2.863883,7.75119 -5.281951,6.204849 -1.241032,2.427649 -2.591671,2.992296 -4.155676,1.645921 1.241799,2.046459 1.311549,3.799615 -0.918706,5.178156 0.283631,2.665066 0.889154,4.713606 -1.419819,6.514479 0.810825,3.215771 0.284257,4.646161 -1.46158,6.305659 1.150634,1.89254 0.795712,4.965631 -1.37806,5.971594 0.433679,1.794114 1.260043,3.905224 -2.75612,4.301221"
+         id="path8754"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccccccc" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path8756"
+         d="m -77.082798,85.771384 4.606425,-8.149829 4.48831,6.437192 3.407378,-6.624492 3.636441,6.468189"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -77.55525,81.793035 c -6.077395,10.585741 3.32686,-5.137926 4.901707,-8.090768 l 4.295019,5.894976 3.854808,-6.426485 3.166954,5.85019"
+         id="path8759"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -38.12999,85.573439 -4.337956,-7.881357 -4.354077,6.16872 -3.720575,-6.791517 -4.074913,6.614347"
+         id="path8761"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path8763"
+         d="m -37.254834,81.793035 c 6.077393,10.585741 -3.504032,-5.019818 -5.078879,-7.97266 l -4.252083,5.776868 -3.720573,-6.426485 -4.023022,5.787559"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/bn.svg b/client/public/images/pieces/Janggi/bn.svg
new file mode 100644
index 00000000..aac11aff
--- /dev/null
+++ b/client/public/images/pieces/Janggi/bn.svg
@@ -0,0 +1,300 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_horse.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.6568542"
+     inkscape:cx="13.444007"
+     inkscape:cy="50.282919"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22334,-4.5642535)"
+       id="g2170"
+       style="stroke:none">
+      <g
+         id="XMLID_19_"
+         style="stroke:none">
+        <g
+           id="g2144"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="491.291,43.542 491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="458.395,61.402 458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="458.395,57.218 458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <g
+       transform="matrix(1.5343938,0,0,1.5343938,74.359347,-44.600686)"
+       id="g4496"
+       style="display:inline">
+      <path
+         style="fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:0.19975252;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -20.363965,43.589358 c -0.0276,-1.46313 -0.713126,-2.145608 -1.299776,-3.329198 -0.571744,1.388345 -1.389781,2.98152 -1.051241,4.192856 -0.64554,-0.302018 -1.29108,0.196403 -1.93662,0.50794 -4.172427,6.925057 -3.872501,6.543133 -7.74648,9.703329 -0.41274,1.0845 -0.66256,1.961621 0.0587,3.579812 0.36665,0.484202 2.0734,1.323734 3.37442,1.496479 0.37959,0.533363 0.0389,0.715844 0.0293,0.850939 0.57883,0.586855 0.84987,0.352113 1.46713,0.528169 1.64825,-1.771306 3.2607,-3.327849 4.75353,-4.166667 1.95618,-0.980405 3.91236,-0.564172 5.86854,-0.704225 1.456321,0.21705 2.389217,-0.81096 2.481038,-0.822807 -0.7034,1.107585 -1.211128,2.439303 -3.126578,3.698394 -1.18159,-0.284668 -1.84361,-0.179659 -2.4061,0 -4.23123,3.229653 -5.76905,8.997115 -5.75117,11.326292 5.708582,2.230783 11.7045,1.157214 17.7229999,-0.176057 -1.599,-1.233028 -1.55432,-2.671516 -1.9953,-4.049296 -0.3933899,-3.368319 0.386688,-3.431093 0.88028,-6.57277 0.34933,-6.266657 -0.432697,-11.619231 -5.5252069,-14.931742 -0.91599,-0.402395 -2.781791,-0.345578 -3.748111,-0.295054 0.0658,-1.508632 -0.62168,-2.655508 -0.98402,-4.021428 -0.008,-0.0078 -1.465491,2.090218 -1.163721,2.744109 -0.07401,0.08009 0.206841,0.429509 0.09838,0.440925 z"
+         id="path4426"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccccccccccccccccccccccc" />
+      <path
+         style="fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:0.09243207;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+         d="m -19.406506,41.091703 c 14.3383277,-1.44366 14.6623349,12.941854 12.9102306,22.786351 -0.3727255,2.094222 0.5431423,3.922119 0.4131333,5.516454 -4.3778739,-1.27574 -3.261783,-4.989674 -2.1272975,-9.89572 0.1816486,-7.188013 -0.4354701,-13.936194 -8.2870824,-15.80692 -0.538977,-0.05014 -1.697034,0.233285 -2.238074,0.223765 -1.184158,0.0502 -0.854474,-2.06219 -0.67091,-2.823934 z"
+         id="path4428"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cscccccc" />
+      <ellipse
+         style="opacity:0.92299996;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.09785748;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
+         id="path4461"
+         cx="-22.465561"
+         cy="49.837406"
+         rx="0.96838528"
+         ry="1.0133952" />
+      <path
+         style="fill:#ececec;stroke:#ececec;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m -24.006062,50.908416 c 1.03577,-0.831732 -0.63174,-2.617565 3.11033,-2.494132"
+         id="path4463"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cc" />
+      <path
+         style="fill:none;stroke:#ffffff;stroke-width:0.93052417;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -29.234621,60.161919 c 0.95231,-0.642849 1.758922,-1.427453 2.394037,-2.268554"
+         id="path4489"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cc" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/bp.svg b/client/public/images/pieces/Janggi/bp.svg
new file mode 100644
index 00000000..a0dbd70b
--- /dev/null
+++ b/client/public/images/pieces/Janggi/bp.svg
@@ -0,0 +1,293 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_pawn.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter18479-1">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469-6" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471-2" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473-4" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475-8" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477-8" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="7.4167645"
+     inkscape:cx="39.827478"
+     inkscape:cy="54.623055"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064425,0,0,1.4064425,-409.68878,-612.16728)"
+       id="g2768"
+       style="stroke:none">
+      <g
+         id="XMLID_8_"
+         style="stroke:none">
+        <g
+           id="g2738"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="340.85,459.453 340.85,473.412 340.818,473.442 330.979,483.282 317.063,483.282 317.022,483.282 307.152,473.412 307.152,459.453 317.022,449.586 330.979,449.586 "
+             id="polygon2730" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="330.979,486.311 330.979,483.325 330.979,483.282 340.818,473.442 340.82,473.446 340.82,476.539 340.84,476.558 331.089,486.311 "
+             id="polygon2732" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="330.979,486.311 330.979,486.346 330.95,486.346 317.067,486.346 317.063,486.346 317.063,486.271 317.063,483.325 317.063,483.282 330.979,483.282 330.979,483.325 "
+             id="polygon2734" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="307.152,476.427 307.152,473.412 317.022,483.282 317.063,483.282 317.063,483.325 317.063,486.271 316.997,486.271 "
+             id="polygon2736" />
+        </g>
+        <g
+           id="g2756"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="317.063,483.282 317.022,483.282 307.152,473.412 307.152,459.453 317.022,449.586 330.979,449.586 340.85,459.453 340.85,473.412 340.818,473.442 330.979,483.282 "
+             id="polygon2740" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="307.152,473.412 307.152,476.427 307.152,476.505    "
+             id="polyline2742" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="317.063,483.325 317.063,486.271 317.063,486.346      317.063,486.414    "
+             id="polyline2744" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="330.979,483.325 330.979,486.311 330.979,486.346      330.979,486.414    "
+             id="polyline2746" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="340.82001"
+             y1="473.44601"
+             x2="340.82001"
+             y2="476.539"
+             id="line2748" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="307.123,476.396 307.152,476.427 316.997,486.271    "
+             id="polyline2750" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="331.089,486.311 340.84,476.558 340.875,476.521    "
+             id="polyline2752" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="317.06699"
+             y1="486.34601"
+             x2="330.95001"
+             y2="486.34601"
+             id="line2754" />
+        </g>
+      </g>
+    </g>
+    <g
+       transform="matrix(0.83616346,0,0,0.83616346,7.6072646,4.5208691)"
+       style="display:inline;fill:#006838;fill-opacity:1;stroke:#0d00b4;stroke-opacity:1"
+       id="g9866">
+      <g
+         style="display:inline;fill:#006838;fill-opacity:1;stroke:#0d00b4;stroke-width:1.31294143;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+         transform="matrix(0.73170801,0,0,0.89061254,62.585414,-13.581686)"
+         id="g2182-3">
+        <g
+           style="fill:#006838;fill-opacity:1;stroke:#0d00b4;stroke-width:1.31294143;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           id="g2180-9"
+           transform="translate(0.4695196,-1.5015006)">
+          <path
+             style="fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:1.31294143;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+             d="m -22.715841,41.496901 c -6.709808,7.383569 -10.663816,12.802391 -14.029253,18.972935 9.833495,-1.692893 19.278926,-2.323037 27.646001,0 -2.69856,-4.464975 -7.002481,-10.253202 -13.616748,-18.972935 z"
+             id="path2176-6"
+             inkscape:connector-curvature="0"
+             sodipodi:nodetypes="cccc" />
+          <path
+             sodipodi:nodetypes="cccccccc"
+             inkscape:connector-curvature="0"
+             id="path2178-9"
+             d="m -26.817667,60.896469 c 1.31085,8.861829 -3.645845,14.386908 -11.545204,19.081976 -5.236973,2.010186 -7.708873,4.499726 -7.614698,9.332185 12.369865,3.211336 31.696805,2.290793 45.67493078,-0.116941 -0.002369,-3.821858 -2.08387088,-9.351048 -7.28998228,-9.958106 -10.3223275,-4.971535 -10.9033515,-10.063579 -11.0201045,-18.30082 -3.173543,-0.438952 -5.925438,-0.207767 -8.204942,-0.03829 z"
+             style="fill:#dd1f26;fill-opacity:1;stroke:#dd1f26;stroke-width:1.31294143;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" />
+        </g>
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/br.svg b/client/public/images/pieces/Janggi/br.svg
new file mode 100644
index 00000000..d85d30de
--- /dev/null
+++ b/client/public/images/pieces/Janggi/br.svg
@@ -0,0 +1,378 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="red_chariot.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient5290"
+       id="linearGradient5306"
+       gradientUnits="userSpaceOnUse"
+       x1="22.018419"
+       y1="47.282806"
+       x2="75.110641"
+       y2="47.282806" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient5290">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop5286" />
+      <stop
+         style="stop-color:#4d4d4d;stop-opacity:1"
+         offset="1"
+         id="stop5288" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.6568542"
+     inkscape:cx="26.470442"
+     inkscape:cy="16.178581"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22206,-4.6324664)"
+       id="g2170">
+      <g
+         id="XMLID_19_">
+        <g
+           id="g2144">
+          <polygon
+             style="fill:#ffffff"
+             points="458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8"
+             points="491.291,43.542 491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8"
+             points="458.395,61.402 458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0"
+             points="458.395,57.218 458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <path
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.17765069px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 39.650099,37.52813 c -0.802875,-0.297661 -1.025097,0.33772 -1.413181,0.706591 0.07326,0.454377 -0.153118,0.660483 0.706591,1.766476 0.74762,0.26103 1.67449,0.05801 2.590832,-0.117766 0.993124,0.170775 1.535409,0.566965 2.119771,0.94212 -0.07396,-0.805693 -0.531427,-1.444819 -1.177651,-2.002005 z"
+       id="path5363"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccc" />
+    <path
+       style="fill:#ffffff;stroke:none;stroke-width:1.17950511;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 40.12116,36.114949 c -0.96817,0.118061 -1.582139,0.513092 -2.002006,1.059886 0.376412,-0.01155 0.771314,-0.03236 1.295415,-0.117765 0.956252,-0.844649 1.539884,-0.332521 2.237536,-0.23553 -0.404039,-0.270953 -0.90248,-0.510445 -1.530945,-0.706591 z"
+       id="path5365"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccc" />
+    <g
+       id="g23299"
+       transform="matrix(0.99937516,0,0,0.99937516,86.98783,-26.570262)">
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8722-0"
+         d="m -33.631311,78.432453 c -0.109046,-1.025934 0.510246,-3.474634 3.77523,-3.606693 1.749162,-3.263349 4.571668,-3.176384 6.53924,0 1.89631,0.17075 3.401249,0.839608 3.337034,3.505573"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.60000002;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccccc"
+         inkscape:connector-curvature="0"
+         id="path5517"
+         d="m -62.352728,49.66382 c 12.079888,0.82929 16.235222,0.778634 20.790704,0.762712 l -0.115084,18.315683 1.15722,-0.03443 0.229866,-18.28125 c 12.78265,0.08801 18.770273,-0.186164 22.633335,-0.762712 -16.199176,-5.185245 -31.999069,-5.283878 -44.696041,-3e-6 z"
+         style="display:inline;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         id="path5173"
+         d="m -36.967544,60.544215 a 16.761462,16.761462 0 0 1 16.76063,16.760626 16.761462,16.761462 0 0 1 -16.76063,16.763172 16.761462,16.761462 0 0 1 -16.763164,-16.763172 16.761462,16.761462 0 0 1 16.763164,-16.760626 z m 0,2.515362 a 14.247242,14.247242 0 0 0 -14.247802,14.245264 14.247242,14.247242 0 0 0 14.247802,14.247802 14.247242,14.247242 0 0 0 14.2478,-14.247802 14.247242,14.247242 0 0 0 -14.2478,-14.245264 z"
+         style="display:inline;opacity:1;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:0.12982513;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
+         inkscape:connector-curvature="0" />
+      <path
+         sodipodi:nodetypes="cccccccccc"
+         inkscape:connector-curvature="0"
+         id="path5176"
+         d="m -56.671227,73.303568 c -1.100359,-1.583321 -2.052595,-4.120182 -3.021921,-5.965553 l -4.114171,-0.07619 c -0.572036,0.863469 -0.801476,1.726938 -0.228571,2.590407 l 3.047542,0.228566 c 0.679011,2.273621 1.630084,4.00315 2.590413,5.714133 l 4.508653,0.16831 c 0.108315,-1.15859 -0.02335,-0.80349 0.360831,-2.611896 -1.235017,0.05123 -1.925316,0.02215 -3.142776,-0.04778 z"
+         style="display:inline;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1.29825127px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path5178"
+         d="m -22.334932,51.601243 c 0.03917,5.884009 0.265917,11.78969 0.115055,16.956669 -4.797619,-5.826791 -6.000532,-6.87719 -14.110332,-8.400876 0.266048,-2.019106 5.124498,-8.160352 8.096482,-8.825452 z"
+         style="display:inline;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1.29825127px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="csccccccc"
+         inkscape:connector-curvature="0"
+         id="path5248"
+         d="m -22.342019,75.908011 c -0.21864,-1.896417 -1.639002,-5.533526 -3.730067,-8.463135 -2.31979,-3.250055 -8.120538,-4.6395 -10.524676,-4.587544 -1.072241,2.513709 -2.372868,5.80951 -10.146798,6.630961 0,0.631156 -0.06417,3.053966 -0.07197,4.001862 -1.007086,0.06729 -2.60815,0.118058 -3.694251,0.04705 -0.198372,0.686616 -0.359385,2.050886 -0.327775,2.418476 9.184798,0.18599 19.417583,0.025 28.495537,-0.0477 z"
+         style="display:inline;fill:#dd1f26;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path5420"
+         d="m -36.380821,75.656271 6.520147,-11.490746"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path5437"
+         d="M -37.2644,75.721291 -37.399229,63.446514"
+         style="display:inline;fill:#000000;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         transform="matrix(-1.3208656,0.32230963,0.32230963,1.3208656,212.71465,-37.019854)"
+         d="m 205.65854,46.250197 -7.41812,-7.953301 2.39221,10.609472 -2.44764,-10.596824 -3.23301,10.384179 3.17869,-10.400935 -7.99196,7.376453 7.9533,-7.418125 -10.60947,2.392212 10.59682,-2.447634 -10.38418,-3.233019 10.40094,3.178699 -7.37646,-7.991966 7.41813,7.953301 -2.39221,-10.609472 2.44763,10.596824 3.23302,-10.384179 -3.1787,10.400935 7.99197,-7.376453 -7.9533,7.418125 10.60947,-2.392213 -10.59683,2.447634 10.38418,3.233019 -10.40093,-3.178698 z"
+         inkscape:randomized="0"
+         inkscape:rounded="0"
+         inkscape:flatsided="false"
+         sodipodi:arg2="1.0846132"
+         sodipodi:arg1="0.82281385"
+         sodipodi:r2="0.10981865"
+         sodipodi:r1="10.981865"
+         sodipodi:cy="38.199802"
+         sodipodi:cx="198.1891"
+         sodipodi:sides="12"
+         id="path5165"
+         style="display:inline;opacity:1;fill:url(#linearGradient5306);fill-opacity:1;stroke:#dd1f26;stroke-width:0.5;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
+         sodipodi:type="star" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path5471"
+         d="m -35.521619,76.090441 11.393108,-6.84261"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccc"
+         inkscape:connector-curvature="0"
+         id="path5473"
+         d="m -38.0037,76.122451 -4.293111,-7.447646 v 0.06741"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         inkscape:connector-curvature="0"
+         id="path5475"
+         d="m -39.768755,76.090441 -7.550462,-4.179724"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/wa.svg b/client/public/images/pieces/Janggi/wa.svg
new file mode 100644
index 00000000..cf28183e
--- /dev/null
+++ b/client/public/images/pieces/Janggi/wa.svg
@@ -0,0 +1,323 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_advisor.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="10.488889"
+     inkscape:cx="45.657747"
+     inkscape:cy="57.533384"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g11207"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.2229935,0,0,1.2229935,-262.19742,-790.48598)"
+       id="g3006">
+      <g
+         id="g11207"
+         transform="matrix(1.15,0,0,1.15,-37.800375,-102.5949)">
+        <g
+           id="XMLID_56_"
+           style="stroke:none">
+          <g
+             id="g2976"
+             style="stroke:none">
+            <polygon
+               id="polygon2968"
+               points="268.852,675.453 268.852,689.412 268.819,689.441 258.98,699.281 245.063,699.281 245.023,699.281 235.153,689.412 235.153,675.453 245.023,665.586 258.98,665.586 "
+               style="fill:#ffffff;stroke:none" />
+            <polygon
+               id="polygon2970"
+               points="258.98,702.309 258.98,699.324 258.98,699.281 268.819,689.441 268.822,689.443 268.822,692.539 268.842,692.557 259.091,702.309 "
+               style="fill:#bcbab8;stroke:none" />
+            <polygon
+               id="polygon2972"
+               points="258.98,702.309 258.98,702.346 258.951,702.346 245.068,702.346 245.063,702.346 245.063,702.271 245.063,699.324 245.063,699.281 258.98,699.281 258.98,699.324 "
+               style="fill:#cecac8;stroke:none" />
+            <polygon
+               id="polygon2974"
+               points="235.153,692.426 235.153,689.412 245.023,699.281 245.063,699.281 245.063,699.324 245.063,702.271 244.998,702.271 "
+               style="fill:#e2e1e0;stroke:none" />
+          </g>
+          <g
+             id="g2994"
+             style="stroke:none">
+            <polygon
+               id="polygon2978"
+               points="245.063,699.281 245.023,699.281 235.153,689.412 235.153,675.453 245.023,665.586 258.98,665.586 268.852,675.453 268.852,689.412 268.819,689.441 258.98,699.281 "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <polyline
+               id="polyline2980"
+               points="235.153,689.412 235.153,692.426 235.153,692.504    "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <polyline
+               id="polyline2982"
+               points="245.063,699.324 245.063,702.271 245.063,702.346      245.063,702.414    "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <polyline
+               id="polyline2984"
+               points="258.98,699.324 258.98,702.309 258.98,702.346      258.98,702.414    "
+               style="fill:none;stroke:none;stroke-width:0.25" />
+            <line
+               id="line2986"
+               y2="692.539"
+               x2="268.82199"
+               y1="689.44299"
+               x1="268.82199"
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+            <polyline
+               id="polyline2988"
+               points="235.123,692.396 235.153,692.426 244.998,702.271    "
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+            <polyline
+               id="polyline2990"
+               points="259.091,702.309 268.842,692.557 268.877,692.521    "
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+            <line
+               id="line2992"
+               y2="702.34601"
+               x2="258.95099"
+               y1="702.34601"
+               x1="245.06799"
+               style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none" />
+          </g>
+        </g>
+        <g
+           transform="matrix(0.61265816,0,0,0.61265816,223.70484,655.33548)"
+           id="g16676"
+           style="display:inline">
+          <g
+             transform="translate(0,3.4415459e-6)"
+             id="g19024">
+            <path
+               sodipodi:nodetypes="cccc"
+               inkscape:connector-curvature="0"
+               id="path8722-0"
+               d="m 53.380882,55.673609 c -0.109046,-1.025935 0.510246,-3.474635 3.77523,-3.606694 1.749162,-3.263349 4.571668,-3.176384 6.53924,0 1.89631,0.17075 3.401249,0.839608 3.337034,3.505572"
+               style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.60000002;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cccccccccccc"
+               inkscape:connector-curvature="0"
+               id="path7039"
+               d="M 46.314318,54.9317 C 42.356998,54.834892 38.28061,55.053577 33.042662,54.572582 29.08398,51.239218 24.163206,34.895196 26.264735,27.515155 l 2.242968,5.073731 c 0.904414,-1.286503 4.443742,-3.043957 5.826002,-0.651772 3.063224,-2.067575 3.965642,-1.47325 6.167862,-0.446321 2.326036,-1.963969 3.759013,-1.686422 5.584723,-0.208555 2.435106,-1.540839 2.91277,-2.315498 5.969919,-0.234576 1.393794,-1.805529 5.348995,-1.238852 6.514895,0.63516 0.72922,-1.449764 3.882256,-1.601314 5.129111,0.705381 l 2.779908,-5.008547 c 1.69577,7.471841 -3.140965,24.150404 -6.983188,27.080935"
+               style="fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1.05248582;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="ccccccc"
+               inkscape:connector-curvature="0"
+               id="path7043"
+               d="m 33.042662,54.221383 c -0.04538,3.440549 0.535511,6.221829 1.46304,9.662379 4.266942,1.897027 7.563074,2.10954 11.478298,2.199874 3.915225,-0.07254 8.300478,-0.65405 11.865019,-2.300217 0.92753,-3.44055 1.712825,-6.121487 1.667438,-9.562036 l -13.213668,0.452419 z"
+               style="fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:0.56941742;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7051"
+               d="m 34.248108,31.144819 c 0.161876,7.627342 2.186141,16.283659 4.225636,23.508654"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7053"
+               d="M 58.487159,30.379647 C 57.905091,37.947181 56.903213,47.41971 54.483762,54.462278"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7088"
+               d="M 52.145463,29.521685 C 51.563396,37.089219 51.450918,46.10004 49.382667,53.242951"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="m 40.524586,30.501832 c 0.161876,7.627343 0.823654,15.521191 2.863149,22.746186"
+               id="path7090"
+               inkscape:connector-curvature="0"
+               sodipodi:nodetypes="cc" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7092"
+               d="M 46.225032,53.395931 46.124215,30.697163"
+               style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               style="fill:none;stroke:#ffffff;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="M 32.779521,55.723468 C 43.040852,53.07175 52.284118,54.00966 60.026058,55.823812"
+               id="path7094"
+               inkscape:connector-curvature="0"
+               sodipodi:nodetypes="cc" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7096"
+               d="m 33.649764,63.258142 c 9.702633,-2.248555 17.829672,-1.559126 24.853754,-0.200528"
+               style="fill:none;stroke:#ffffff;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <circle
+               r="1.4591321"
+               cy="58.035988"
+               cx="46.108307"
+               id="path7098"
+               style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.56941742;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
+            <path
+               sodipodi:nodetypes="cc"
+               inkscape:connector-curvature="0"
+               id="path7051-0"
+               d="m 29.471433,30.206797 c -1.317204,7.565714 2.169353,17.040115 4.945284,24.295795"
+               style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+            <path
+               style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="m 63.310845,30.432888 c 1.317204,7.565714 -2.544353,16.790115 -5.320284,24.045795"
+               id="path7645"
+               inkscape:connector-curvature="0"
+               sodipodi:nodetypes="cc" />
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/wc.svg b/client/public/images/pieces/Janggi/wc.svg
new file mode 100644
index 00000000..4ea92045
--- /dev/null
+++ b/client/public/images/pieces/Janggi/wc.svg
@@ -0,0 +1,385 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_cannon.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+    <filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter19100">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood19090" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite19092" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur19094" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset19096" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite19098" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="4"
+     inkscape:cx="-18.042175"
+     inkscape:cy="10.758421"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22206,-4.6324664)"
+       id="g2170">
+      <g
+         id="XMLID_19_">
+        <g
+           id="g2144">
+          <polygon
+             style="fill:#ffffff"
+             points="458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8"
+             points="491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 491.291,43.542 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8"
+             points="458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 458.395,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0"
+             points="458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 458.395,57.218 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <path
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.17765069px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 39.650096,37.52813 c -0.802875,-0.297661 -1.025097,0.33772 -1.413181,0.706591 0.07326,0.454377 -0.153118,0.660483 0.706591,1.766476 0.74762,0.26103 1.67449,0.05801 2.590832,-0.117766 0.993124,0.170775 1.535409,0.566965 2.119771,0.94212 -0.07396,-0.805693 -0.531427,-1.444819 -1.177651,-2.002005 z"
+       id="path5363"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccc" />
+    <path
+       style="fill:#ffffff;stroke:none;stroke-width:1.17950511;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 40.121157,36.114949 c -0.96817,0.118061 -1.582139,0.513092 -2.002006,1.059886 0.376412,-0.01155 0.771314,-0.03236 1.295415,-0.117765 0.956252,-0.844649 1.539884,-0.332521 2.237536,-0.23553 -0.404039,-0.270953 -0.90248,-0.510445 -1.530945,-0.706591 z"
+       id="path5365"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccc" />
+    <g
+       style="display:inline"
+       id="g5204"
+       transform="matrix(-0.98743104,0,0,0.98743104,853.03365,-233.12)">
+      <g
+         transform="matrix(0.42429161,0,0,0.35530383,319.4593,167.8082)"
+         id="g4916">
+        <g
+           id="g873"
+           transform="matrix(0.91849155,-0.04088349,0.02866942,0.91849155,95.269582,54.832886)">
+          <path
+             id="path47"
+             d="m 1213.6335,288.03625 -92.5944,36.18456 c 0,0 -8.0242,8.93392 -2.8931,21.42532 l 0.063,0.30499 0.063,0.30498 c 4.9395,12.5585 16.4998,12.34665 16.4998,12.34665 37.098,-28.13428 66.1489,-38.4485 87.024,-50.31774 -0.192,-4.06467 -1.8458,-7.47907 -2.8249,-11.1936 -1.3824,-3.19489 -2.9322,-6.31529 -5.3374,-9.05516 z"
+             style="fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:2.65330386;stroke-miterlimit:10;stroke-opacity:1"
+             inkscape:connector-curvature="0"
+             sodipodi:nodetypes="ccccccccc" />
+          <ellipse
+             transform="matrix(0.95110508,-0.30886749,0.22204229,0.97503704,0,0)"
+             ry="3.6617434"
+             rx="3.753881"
+             stroke-miterlimit="10"
+             cx="1017.132"
+             cy="677.90155"
+             id="circle53"
+             style="fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:3.00610209;stroke-miterlimit:10;stroke-opacity:1" />
+        </g>
+        <path
+           style="opacity:1;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:1.83159566;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           d="m 1188.053,314.76933 -0.1997,22.82133 -37.6537,4.53206 c -16.1431,26.71247 -25.0217,28.93186 -41.2475,19.47896 18.33,-6.79184 27.9258,-27.84095 38.5459,-46.51534 z"
+           id="rect875"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="cccccc" />
+        <ellipse
+           style="opacity:1;fill:#0d00b4;fill-opacity:1;stroke:#ffffff;stroke-width:1.99324226;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="path869"
+           transform="matrix(-0.99442868,-0.10541155,-0.07412913,0.99724865,0,0)"
+           ry="32.340363"
+           rx="27.158773"
+           cy="214.17735"
+           cx="-1207.3654" />
+        <ellipse
+           style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:2.05792236;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="path890"
+           cx="1184.762"
+           cy="340.7244"
+           rx="17.729818"
+           ry="21.17234" />
+        <rect
+           style="display:inline;opacity:1;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:2.22107673;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="rect892-1"
+           width="2.9200215"
+           height="41.437584"
+           x="-684.76074"
+           y="1132.5303"
+           transform="matrix(-0.62961158,0.77691007,0.65434208,0.75619868,0,0)" />
+        <rect
+           transform="matrix(-0.65516628,-0.75548471,-0.62877406,0.77758805,0,0)"
+           y="-703.56848"
+           x="-1155.4326"
+           height="41.684681"
+           width="2.9027057"
+           id="rect909"
+           style="opacity:1;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:2.2210741;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
+        <rect
+           transform="matrix(0.0023305,0.99999728,0.99999448,-0.00332335,0,0)"
+           y="1165.2843"
+           x="343.79016"
+           height="37.732437"
+           width="3.156975"
+           id="rect911"
+           style="display:inline;opacity:1;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:2.2037704;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
+        <rect
+           style="opacity:1;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:2.20377064;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="rect913"
+           width="2.6436777"
+           height="45.058598"
+           x="-1184.9684"
+           y="323.77573"
+           transform="matrix(-0.99998924,0.00463819,0.00325253,0.99999471,0,0)" />
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/we.svg b/client/public/images/pieces/Janggi/we.svg
new file mode 100644
index 00000000..6310a331
--- /dev/null
+++ b/client/public/images/pieces/Janggi/we.svg
@@ -0,0 +1,298 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_elephant.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.6568542"
+     inkscape:cx="15.673652"
+     inkscape:cy="24.156548"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22334,-4.5642535)"
+       id="g2170"
+       style="stroke:none">
+      <g
+         id="XMLID_19_"
+         style="stroke:none">
+        <g
+           id="g2144"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="491.291,43.542 491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="458.395,61.402 458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="458.395,57.218 458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <g
+       style="display:inline"
+       id="g5374"
+       transform="matrix(1.1776506,0,0,1.1776506,-54.132169,3.9567062)">
+      <g
+         transform="translate(-35.93211,25.548233)"
+         style="opacity:1;fill:#0d00b4;fill-opacity:1"
+         id="g5357">
+        <path
+           style="fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="m 125.66609,-2.121176 -3.2,5 -0.6,2.1 c -0.0945,1.5296586 0.15617,2.8292194 0.6,4 l -0.2,2.099999 c -1.09796,3.097738 -2.35981,6.067197 -2.60001,9.5 0.12511,0.773672 0.40427,1.44388 1.3,1.7 11.23011,-0.424319 16.82956,-5.233235 20.30001,-11.7 l 0.2,-2.099999 c -2.10707,-8.89280401 -8.15113,-13.4502442 -16.2,-15.8 -4.40015,-0.5317426 -7.59668,1.3815851 -10.20001,4.5 -2.59354,2.64077835 -4.39616,5.9439949 -5.3,10 -0.89646,1.6487885 -1.64452,1.9405129 -2.4,2.3 -2.28978,-0.6407124 -3.03862,-1.6262894 -2.5,-2.9 0.35259,-1.8089896 3.48816,-3.3504905 5.5,-5 1.59764,-2.6483718 2.34637,-5.1951958 -0.6,-7.3 -8.75831,-2.0518262 -7.05798,4.7061225 -5.2,6.20000004 1.23982,-0.5457366 2.00197,-1.22280981 2.4,-2.00000004 -0.25951,-0.4357328 -0.98217,-0.8162564 0,-1.4 0.5387,0.045976 0.81918,0.2856122 1,0.6 0,1 0.50403,1.1455069 -3.6,4 -2.41796,1.1605474 -2.59331,2.9892138 -3.5,4.6 -1.668162,8.737445 1.94976,11.358136 6.5,12.899999 0.86488,-0.721198 1.12021,-1.741094 1.5,-2.7 1.29573,0.281592 2.51468,0.385517 4.3,1.8 0.43333,-0.4 0.86667,-0.8 1.3,-1.2 l 1.1,0.5 -0.9,0.5 c -0.61971,0.861505 -1.43108,1.608021 -2.5,2.2 l 2.4,0.3 c 1.087,-0.403589 1.93334,-1.017048 2.7,-1.7 l 1.3,-0.4 c 1.21385,-2.971538 2.39138,-5.952154 2.9,-9.099999 -0.0806,-0.9844358 -0.10227,-1.7702685 -0.7,-4.5 l 0.7,-2.3 z"
+           id="path5349"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="cccccccccccccccccccccccccccccccccccc" />
+        <path
+           style="fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="m 109.56608,17.578823 c -1.32838,4.066443 -4.04985,6.321863 -6.6,8.8 -0.20576,0.304421 0.14574,0.397532 1,0.3 3.90473,-1.863513 6.85963,-4.360243 8.1,-8 -0.78642,-0.41302 -1.31194,-1.08384 -2.5,-1.1 z"
+           id="path5353"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ccccc" />
+      </g>
+      <path
+         sodipodi:nodetypes="ccccccc"
+         inkscape:connector-curvature="0"
+         id="path5363"
+         d="m 79.63397,28.56504 c -0.68176,-0.252758 -0.87046,0.286775 -1.2,0.6 0.0622,0.385834 -0.13002,0.560848 0.6,1.5 0.63484,0.221654 1.42189,0.04926 2.2,-0.1 0.84331,0.145013 1.30379,0.481437 1.8,0.8 -0.0628,-0.684154 -0.45126,-1.226866 -1,-1.7 z"
+         style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path5365"
+         d="m 80.03397,27.36504 c -0.82212,0.100251 -1.34347,0.435691 -1.7,0.9 0.31963,-0.0098 0.65496,-0.02748 1.1,-0.1 0.812,-0.717231 1.30759,-0.282359 1.9,-0.2 -0.34309,-0.230079 -0.76634,-0.433443 -1.3,-0.6 z"
+         style="fill:#ffffff;stroke:none;stroke-width:1.00157475;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/wk.svg b/client/public/images/pieces/Janggi/wk.svg
new file mode 100644
index 00000000..3ff67525
--- /dev/null
+++ b/client/public/images/pieces/Janggi/wk.svg
@@ -0,0 +1,347 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_king.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.2444445"
+     inkscape:cx="-24.49702"
+     inkscape:cy="56.359783"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g17436"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.1618787,0,0,1.1618787,-330.4487,-79.4829)"
+       id="g3316"
+       style="stroke:none">
+      <g
+         id="XMLID_18_"
+         style="stroke:none">
+        <g
+           id="g3290"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="309.854,139.159 309.771,139.159 289.65,119.037 289.65,90.573 309.771,70.451 338.232,70.451 358.357,90.573 358.357,119.037 358.293,119.102 338.232,139.159 "
+             id="polygon3282" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="358.342,125.456 338.459,145.334 338.232,145.334 338.232,139.245 338.232,139.159 358.293,119.102 358.299,119.105 358.299,125.413 "
+             id="polygon3284" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="309.854,145.406 309.854,145.261 309.854,139.245 309.854,139.159 338.232,139.159 338.232,139.245 338.232,145.334 338.232,145.406 338.176,145.406 309.867,145.406 "
+             id="polygon3286" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="289.65,125.186 289.65,119.037 309.771,139.159 309.854,139.159 309.854,139.245 309.854,145.261 309.725,145.261 "
+             id="polygon3288" />
+        </g>
+        <g
+           id="g3308"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="309.771,70.451 338.232,70.451 358.357,90.573 358.357,119.037 358.293,119.102 338.232,139.159 309.854,139.159 309.771,139.159 289.65,119.037 289.65,90.573 "
+             id="polygon3292" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="289.65,119.037 289.65,125.186 289.65,125.34    "
+             id="polyline3294" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="309.854,139.245 309.854,145.261 309.854,145.406      309.854,145.549    "
+             id="polyline3296" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="338.232,139.245 338.232,145.334 338.232,145.406      338.232,145.549    "
+             id="polyline3298" />
+          <line
+             style="fill:#000000;stroke:none;stroke-width:0.30000001;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="358.29901"
+             y1="119.105"
+             x2="358.29901"
+             y2="125.413"
+             id="line3300" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="289.59,125.125 289.65,125.186 309.725,145.261    "
+             id="polyline3302" />
+          <polyline
+             style="fill:#000000;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="338.459,145.334 358.342,125.456 358.41,125.383    "
+             id="polyline3304" />
+          <line
+             style="fill:#000000;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="309.867"
+             y1="145.40601"
+             x2="338.17599"
+             y2="145.40601"
+             id="line3306" />
+        </g>
+      </g>
+    </g>
+    <g
+       id="g17436"
+       transform="matrix(0.855,0,0,0.855,94.978815,-3.2724128)">
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8722-0"
+         d="m -46.436313,67.627388 c -0.165607,-1.558081 0.774903,-5.276887 5.733388,-5.477429 2.656427,-4.956003 6.942927,-4.823938 9.93105,0 2.879899,0.259315 5.165429,1.275088 5.067906,5.323859"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.91121149;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path7039"
+         d="m -57.320805,72.679341 c -6.587623,-0.161148 -13.373454,0.202897 -22.092897,-0.5978 -4.644875,-6.629519 -11.648069,-30.617494 -10.013333,-41.867478 12.35247,-7.523857 56.13743,-9.504467 63.13627,0.250568 1.634736,11.249969 -4.440486,34.800972 -9.085364,41.430476"
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1.75203907;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccccc"
+         inkscape:connector-curvature="0"
+         id="path7043"
+         d="m -79.413702,71.496908 c -0.07556,5.727374 0.891447,10.357269 2.435475,16.084643 7.103041,3.157925 12.590005,3.511688 19.107551,3.662068 6.51755,-0.120736 13.817539,-1.088776 19.751315,-3.829093 1.544028,-5.727374 2.851285,-10.190244 2.775729,-15.917618 l -21.996365,0.753131 z"
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:0.94789076;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path7068"
+         d="m -80.415928,73.716923 c 15.363356,-4.076776 31.908131,-4.078431 45.984826,0.08353"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path7088"
+         d="m -50.837732,39.297444 -3.457918,17.89718"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:2.27802849;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:2.27802849;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -63.933796,40.206332 2.606055,16.511744"
+         id="path7090"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cc" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path7096"
+         d="m -78.403079,86.775676 c 16.151659,-3.74309 29.680479,-2.595419 41.373241,-0.333807"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <ellipse
+         cy="77.338402"
+         cx="-57.830784"
+         id="path7098"
+         style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.46574509;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         rx="3.6733813"
+         ry="3.8404188" />
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8714"
+         d="m -89.936897,29.767797 c 4.604116,13.481814 9.450029,9.250497 10.494288,10.984548 1.212388,3.873044 6.257555,29.772983 6.257555,29.772983 l 0.250556,1.25278"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -25.668126,29.295334 c -4.604116,13.481829 -8.387009,9.132389 -9.431269,10.86644 -1.212388,3.873043 -7.320574,29.891091 -7.320574,29.891091 l -0.250556,1.252779"
+         id="path8716"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccc" />
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8718"
+         d="m -79.419391,40.533776 c 8.133783,-7.708439 11.870546,-1.755373 15.952094,-0.501106 3.267322,-2.941816 6.587792,-6.207263 12.867369,-0.367446 4.426071,-4.312065 11.345369,-4.308663 15.612545,0.367446"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8722"
+         d="m -70.62886,70.802899 c 0.500416,-3.591616 -0.90907,-9.390718 7.547935,-10.748043 2.791835,-6.768023 7.378407,-7.251421 10.80662,0 4.442754,2.044029 6.941217,0.989606 7.301389,10.698959"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:3.0373714;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cccccccc"
+         inkscape:connector-curvature="0"
+         id="path8751"
+         d="m -91.830501,35.622938 c 0.68816,2.110351 2.863883,7.751205 5.281951,6.204864 1.241032,2.427635 2.591671,2.992297 4.155675,1.645906 -1.241799,2.046475 -1.311549,3.799631 0.918707,5.178172 -0.283632,2.665066 -0.889154,4.713591 1.419819,6.514463 -0.810825,3.215772 -0.284257,4.646176 1.46158,6.305675 -1.150634,1.892525 -0.795712,4.965631 1.37806,5.971593 -0.433679,1.794115 -1.260043,3.90521 2.75612,4.301222"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5186857;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.5186857;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -22.736654,35.472452 c -0.688161,2.11035 -2.863883,7.75119 -5.281951,6.204849 -1.241032,2.427649 -2.591671,2.992296 -4.155676,1.645921 1.241799,2.046459 1.311549,3.799615 -0.918706,5.178156 0.283631,2.665066 0.889154,4.713606 -1.419819,6.514479 0.810825,3.215771 0.284257,4.646161 -1.46158,6.305659 1.150634,1.89254 0.795712,4.965631 -1.37806,5.971594 0.433679,1.794114 1.260043,3.905224 -2.75612,4.301221"
+         id="path8754"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccccccc" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path8756"
+         d="m -77.082798,85.771384 4.606425,-8.149829 4.48831,6.437192 3.407378,-6.624492 3.636441,6.468189"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -77.55525,81.793035 c -6.077395,10.585741 3.32686,-5.137926 4.901707,-8.090768 l 4.295019,5.894976 3.854808,-6.426485 3.166954,5.85019"
+         id="path8759"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -38.12999,85.573439 -4.337956,-7.881357 -4.354077,6.16872 -3.720575,-6.791517 -4.074913,6.614347"
+         id="path8761"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path8763"
+         d="m -37.254834,81.793035 c 6.077393,10.585741 -3.504032,-5.019818 -5.078879,-7.97266 l -4.252083,5.776868 -3.720573,-6.426485 -4.023022,5.787559"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.21494865;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/wn.svg b/client/public/images/pieces/Janggi/wn.svg
new file mode 100644
index 00000000..210a0bff
--- /dev/null
+++ b/client/public/images/pieces/Janggi/wn.svg
@@ -0,0 +1,300 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_horse.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="5.6568542"
+     inkscape:cx="13.444007"
+     inkscape:cy="36.140783"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22334,-4.5642535)"
+       id="g2170"
+       style="stroke:none">
+      <g
+         id="XMLID_19_"
+         style="stroke:none">
+        <g
+           id="g2144"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="491.291,43.542 491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="458.395,61.402 458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="458.395,57.218 458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <g
+       transform="matrix(1.5343938,0,0,1.5343938,74.359347,-44.600686)"
+       id="g4496"
+       style="display:inline">
+      <path
+         style="fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:0.19975252;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -20.363965,43.589358 c -0.0276,-1.46313 -0.713126,-2.145608 -1.299776,-3.329198 -0.571744,1.388345 -1.389781,2.98152 -1.051241,4.192856 -0.64554,-0.302018 -1.29108,0.196403 -1.93662,0.50794 -4.172427,6.925057 -3.872501,6.543133 -7.74648,9.703329 -0.41274,1.0845 -0.66256,1.961621 0.0587,3.579812 0.36665,0.484202 2.0734,1.323734 3.37442,1.496479 0.37959,0.533363 0.0389,0.715844 0.0293,0.850939 0.57883,0.586855 0.84987,0.352113 1.46713,0.528169 1.64825,-1.771306 3.2607,-3.327849 4.75353,-4.166667 1.95618,-0.980405 3.91236,-0.564172 5.86854,-0.704225 1.456321,0.21705 2.389217,-0.81096 2.481038,-0.822807 -0.7034,1.107585 -1.211128,2.439303 -3.126578,3.698394 -1.18159,-0.284668 -1.84361,-0.179659 -2.4061,0 -4.23123,3.229653 -5.76905,8.997115 -5.75117,11.326292 5.708582,2.230783 11.7045,1.157214 17.7229999,-0.176057 -1.599,-1.233028 -1.55432,-2.671516 -1.9953,-4.049296 -0.3933899,-3.368319 0.386688,-3.431093 0.88028,-6.57277 0.34933,-6.266657 -0.432697,-11.619231 -5.5252069,-14.931742 -0.91599,-0.402395 -2.781791,-0.345578 -3.748111,-0.295054 0.0658,-1.508632 -0.62168,-2.655508 -0.98402,-4.021428 -0.008,-0.0078 -1.465491,2.090218 -1.163721,2.744109 -0.07401,0.08009 0.206841,0.429509 0.09838,0.440925 z"
+         id="path4426"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccccccccccccccccccccccc" />
+      <path
+         style="fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:0.09243207;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+         d="m -19.406506,41.091703 c 14.3383277,-1.44366 14.6623349,12.941854 12.9102306,22.786351 -0.3727255,2.094222 0.5431423,3.922119 0.4131333,5.516454 -4.3778739,-1.27574 -3.261783,-4.989674 -2.1272975,-9.89572 0.1816486,-7.188013 -0.4354701,-13.936194 -8.2870824,-15.80692 -0.538977,-0.05014 -1.697034,0.233285 -2.238074,0.223765 -1.184158,0.0502 -0.854474,-2.06219 -0.67091,-2.823934 z"
+         id="path4428"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cscccccc" />
+      <ellipse
+         style="opacity:0.92299996;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.09785748;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
+         id="path4461"
+         cx="-22.465561"
+         cy="49.837406"
+         rx="0.96838528"
+         ry="1.0133952" />
+      <path
+         style="fill:#ececec;stroke:#ececec;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m -24.006062,50.908416 c 1.03577,-0.831732 -0.63174,-2.617565 3.11033,-2.494132"
+         id="path4463"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cc" />
+      <path
+         style="fill:none;stroke:#ffffff;stroke-width:0.93052417;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m -29.234621,60.161919 c 0.95231,-0.642849 1.758922,-1.427453 2.394037,-2.268554"
+         id="path4489"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cc" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/wp.svg b/client/public/images/pieces/Janggi/wp.svg
new file mode 100644
index 00000000..9eaf41d9
--- /dev/null
+++ b/client/public/images/pieces/Janggi/wp.svg
@@ -0,0 +1,293 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_pawn.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <filter
+       style="color-interpolation-filters:sRGB"
+       inkscape:label="Drop Shadow"
+       id="filter18479-1">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469-6" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471-2" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473-4" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475-8" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477-8" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="7.4167645"
+     inkscape:cx="22.881422"
+     inkscape:cy="51.356505"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064425,0,0,1.4064425,-409.68878,-612.16728)"
+       id="g2768"
+       style="stroke:none">
+      <g
+         id="XMLID_8_"
+         style="stroke:none">
+        <g
+           id="g2738"
+           style="stroke:none">
+          <polygon
+             style="fill:#ffffff;stroke:none"
+             points="340.85,459.453 340.85,473.412 340.818,473.442 330.979,483.282 317.063,483.282 317.022,483.282 307.152,473.412 307.152,459.453 317.022,449.586 330.979,449.586 "
+             id="polygon2730" />
+          <polygon
+             style="fill:#bcbab8;stroke:none"
+             points="330.979,486.311 330.979,483.325 330.979,483.282 340.818,473.442 340.82,473.446 340.82,476.539 340.84,476.558 331.089,486.311 "
+             id="polygon2732" />
+          <polygon
+             style="fill:#cecac8;stroke:none"
+             points="330.979,486.311 330.979,486.346 330.95,486.346 317.067,486.346 317.063,486.346 317.063,486.271 317.063,483.325 317.063,483.282 330.979,483.282 330.979,483.325 "
+             id="polygon2734" />
+          <polygon
+             style="fill:#e2e1e0;stroke:none"
+             points="307.152,476.427 307.152,473.412 317.022,483.282 317.063,483.282 317.063,483.325 317.063,486.271 316.997,486.271 "
+             id="polygon2736" />
+        </g>
+        <g
+           id="g2756"
+           style="stroke:none">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="317.063,483.282 317.022,483.282 307.152,473.412 307.152,459.453 317.022,449.586 330.979,449.586 340.85,459.453 340.85,473.412 340.818,473.442 330.979,483.282 "
+             id="polygon2740" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="307.152,473.412 307.152,476.427 307.152,476.505    "
+             id="polyline2742" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="317.063,483.325 317.063,486.271 317.063,486.346      317.063,486.414    "
+             id="polyline2744" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="330.979,483.325 330.979,486.311 330.979,486.346      330.979,486.414    "
+             id="polyline2746" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="340.82001"
+             y1="473.44601"
+             x2="340.82001"
+             y2="476.539"
+             id="line2748" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="307.123,476.396 307.152,476.427 316.997,486.271    "
+             id="polyline2750" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="331.089,486.311 340.84,476.558 340.875,476.521    "
+             id="polyline2752" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="317.06699"
+             y1="486.34601"
+             x2="330.95001"
+             y2="486.34601"
+             id="line2754" />
+        </g>
+      </g>
+    </g>
+    <g
+       transform="matrix(0.83616346,0,0,0.83616346,7.6072646,4.5208691)"
+       style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-opacity:1"
+       id="g9866">
+      <g
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:1.31294143;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+         transform="matrix(0.73170801,0,0,0.89061254,62.585414,-13.581686)"
+         id="g2182-3">
+        <g
+           style="fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:1.31294143;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           id="g2180-9"
+           transform="translate(0.4695196,-1.5015006)">
+          <path
+             style="fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:1.31294143;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
+             d="m -22.715841,41.496901 c -6.709808,7.383569 -10.663816,12.802391 -14.029253,18.972935 9.833495,-1.692893 19.278926,-2.323037 27.646001,0 -2.69856,-4.464975 -7.002481,-10.253202 -13.616748,-18.972935 z"
+             id="path2176-6"
+             inkscape:connector-curvature="0"
+             sodipodi:nodetypes="cccc" />
+          <path
+             sodipodi:nodetypes="cccccccc"
+             inkscape:connector-curvature="0"
+             id="path2178-9"
+             d="m -26.817667,60.896469 c 1.31085,8.861829 -3.645845,14.386908 -11.545204,19.081976 -5.236973,2.010186 -7.708873,4.499726 -7.614698,9.332185 12.369865,3.211336 31.696805,2.290793 45.67493078,-0.116941 -0.002369,-3.821858 -2.08387088,-9.351048 -7.28998228,-9.958106 -10.3223275,-4.971535 -10.9033515,-10.063579 -11.0201045,-18.30082 -3.173543,-0.438952 -5.925438,-0.207767 -8.204942,-0.03829 z"
+             style="fill:#0d00b4;fill-opacity:1;stroke:#0d00b4;stroke-width:1.31294143;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers" />
+        </g>
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Janggi/wr.svg b/client/public/images/pieces/Janggi/wr.svg
new file mode 100644
index 00000000..bb7d5a97
--- /dev/null
+++ b/client/public/images/pieces/Janggi/wr.svg
@@ -0,0 +1,378 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="92"
+   height="92"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+   sodipodi:docname="blue_chariot.svg">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10">
+    <filter
+       height="1.5"
+       width="1.5"
+       y="0"
+       x="0"
+       id="f1"
+       color-interpolation-filters="sRGB">
+      <feOffset
+         id="feOffset3039"
+         dy="0"
+         dx="1"
+         in="SourceAlpha"
+         result="offOut" />
+      <feGaussianBlur
+         id="feGaussianBlur3041"
+         stdDeviation="1"
+         in="offOut"
+         result="blurOut" />
+      <!--
+      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
+-->
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad1">
+      <stop
+         id="stop3034"
+         style="stop-color:rgb(255,255,255);stop-opacity:0.6"
+         offset="20%" />
+      <stop
+         id="stop3036"
+         style="stop-color:rgb(220,0,0);stop-opacity:0.5"
+         offset="50%" />
+    </linearGradient>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="grad0">
+      <stop
+         id="stop3029"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.3"
+         offset="20%" />
+      <stop
+         id="stop3031"
+         style="stop-color:rgb(0,0,0);stop-opacity:0.6"
+         offset="100%" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="mirror_symmetry"
+       start_point="274.21267,350.55066"
+       end_point="273.50284,477.30227"
+       center_point="273.85776,413.92646"
+       id="path-effect4557-0-4"
+       is_visible="true"
+       mode="free"
+       discard_orig_path="false"
+       fuse_paths="true"
+       oposite_fuse="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter18479">
+      <feFlood
+         flood-opacity="1"
+         flood-color="rgb(91,93,90)"
+         result="flood"
+         id="feFlood18469" />
+      <feComposite
+         in="flood"
+         in2="SourceGraphic"
+         operator="in"
+         result="composite1"
+         id="feComposite18471" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="0"
+         result="blur"
+         id="feGaussianBlur18473" />
+      <feOffset
+         dx="0"
+         dy="4"
+         result="offset"
+         id="feOffset18475" />
+      <feComposite
+         in="SourceGraphic"
+         in2="offset"
+         operator="over"
+         result="composite2"
+         id="feComposite18477" />
+    </filter>
+    <linearGradient
+       y2="1"
+       x2="0"
+       y1="0"
+       x1="0"
+       id="linearGradient11421">
+      <stop
+         id="stop11417"
+         style="stop-color:#c83737;stop-opacity:1"
+         offset="20%" />
+      <stop
+         id="stop11419"
+         style="stop-color:#de8787;stop-opacity:1"
+         offset="100%" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient5398"
+       x1="0"
+       y1="0"
+       x2="0"
+       y2="1">
+      <stop
+         offset="20%"
+         style="stop-color:#c83737;stop-opacity:1"
+         id="stop5394" />
+      <stop
+         offset="100%"
+         style="stop-color:#cf8080;stop-opacity:1"
+         id="stop5396" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient5290"
+       id="linearGradient5306"
+       gradientUnits="userSpaceOnUse"
+       x1="22.018419"
+       y1="47.282806"
+       x2="75.110641"
+       y2="47.282806" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient5290">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop5286" />
+      <stop
+         style="stop-color:#4d4d4d;stop-opacity:1"
+         offset="1"
+         id="stop5288" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="8"
+     inkscape:cx="77.917475"
+     inkscape:cy="47.111972"
+     inkscape:window-x="1912"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:pagecheckerboard="false"
+     showguides="false" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="Background"
+     style="display:inline">
+    <g
+       transform="matrix(1.4064574,0,0,1.4064574,-612.22206,-4.6324664)"
+       id="g2170">
+      <g
+         id="XMLID_19_">
+        <g
+           id="g2144">
+          <polygon
+             style="fill:#ffffff"
+             points="458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 "
+             id="polygon2136" />
+          <polygon
+             style="fill:#bcbab8"
+             points="491.291,43.542 491.291,47.825 491.32,47.854 477.818,61.352 477.666,61.352 477.666,57.218 477.666,57.16 491.287,43.539 "
+             id="polygon2138" />
+          <polygon
+             style="fill:#cecac8"
+             points="458.395,61.402 458.395,61.303 458.395,57.218 458.395,57.16 477.666,57.16 477.666,57.218 477.666,61.352 477.666,61.402 477.627,61.402 458.402,61.402 "
+             id="polygon2140" />
+          <polygon
+             style="fill:#e2e1e0"
+             points="458.395,57.218 458.395,61.303 458.307,61.303 444.674,47.67 444.674,43.496 458.338,57.16 458.395,57.16 "
+             id="polygon2142" />
+        </g>
+        <g
+           id="g2162">
+          <polygon
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.338,10.501 477.666,10.501 491.332,24.167 491.332,43.496 491.287,43.539 477.666,57.16 458.395,57.16 458.338,57.16 444.674,43.496 444.674,24.167 "
+             id="polygon2146" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="444.674,43.496 444.674,47.67 444.674,47.776    "
+             id="polyline2148" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="458.395,57.218 458.395,61.303 458.395,61.402      458.395,61.499    "
+             id="polyline2150" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25"
+             points="477.666,57.218 477.666,61.352 477.666,61.402      477.666,61.499    "
+             id="polyline2152" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="491.29099"
+             y1="43.542"
+             x2="491.29099"
+             y2="47.825001"
+             id="line2154" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="444.633,47.629 444.674,47.67 458.307,61.303    "
+             id="polyline2156" />
+          <polyline
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             points="477.818,61.352 491.32,47.854 491.367,47.805    "
+             id="polyline2158" />
+          <line
+             style="fill:none;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none"
+             x1="458.40201"
+             y1="61.402"
+             x2="477.62701"
+             y2="61.402"
+             id="line2160" />
+        </g>
+      </g>
+    </g>
+    <path
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.17765069px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 39.650099,37.52813 c -0.802875,-0.297661 -1.025097,0.33772 -1.413181,0.706591 0.07326,0.454377 -0.153118,0.660483 0.706591,1.766476 0.74762,0.26103 1.67449,0.05801 2.590832,-0.117766 0.993124,0.170775 1.535409,0.566965 2.119771,0.94212 -0.07396,-0.805693 -0.531427,-1.444819 -1.177651,-2.002005 z"
+       id="path5363"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccc" />
+    <path
+       style="fill:#ffffff;stroke:none;stroke-width:1.17950511;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 40.12116,36.114949 c -0.96817,0.118061 -1.582139,0.513092 -2.002006,1.059886 0.376412,-0.01155 0.771314,-0.03236 1.295415,-0.117765 0.956252,-0.844649 1.539884,-0.332521 2.237536,-0.23553 -0.404039,-0.270953 -0.90248,-0.510445 -1.530945,-0.706591 z"
+       id="path5365"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccc" />
+    <g
+       id="g23299"
+       transform="matrix(0.99937516,0,0,0.99937516,86.98783,-26.570262)">
+      <path
+         sodipodi:nodetypes="cccc"
+         inkscape:connector-curvature="0"
+         id="path8722-0"
+         d="m -33.631311,78.432453 c -0.109046,-1.025934 0.510246,-3.474634 3.77523,-3.606693 1.749162,-3.263349 4.571668,-3.176384 6.53924,0 1.89631,0.17075 3.401249,0.839608 3.337034,3.505573"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.60000002;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccccc"
+         inkscape:connector-curvature="0"
+         id="path5517"
+         d="m -62.352728,49.66382 c 12.079888,0.82929 16.235222,0.778634 20.790704,0.762712 l -0.115084,18.315683 1.15722,-0.03443 0.229866,-18.28125 c 12.78265,0.08801 18.770273,-0.186164 22.633335,-0.762712 -16.199176,-5.185245 -31.999069,-5.283878 -44.696041,-3e-6 z"
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         id="path5173"
+         d="m -36.967544,60.544215 a 16.761462,16.761462 0 0 1 16.76063,16.760626 16.761462,16.761462 0 0 1 -16.76063,16.763172 16.761462,16.761462 0 0 1 -16.763164,-16.763172 16.761462,16.761462 0 0 1 16.763164,-16.760626 z m 0,2.515362 a 14.247242,14.247242 0 0 0 -14.247802,14.245264 14.247242,14.247242 0 0 0 14.247802,14.247802 14.247242,14.247242 0 0 0 14.2478,-14.247802 14.247242,14.247242 0 0 0 -14.2478,-14.245264 z"
+         style="display:inline;opacity:1;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:0.12982513;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
+         inkscape:connector-curvature="0" />
+      <path
+         sodipodi:nodetypes="cccccccccc"
+         inkscape:connector-curvature="0"
+         id="path5176"
+         d="m -56.671227,73.303568 c -1.100359,-1.583321 -2.052595,-4.120182 -3.021921,-5.965553 l -4.114171,-0.07619 c -0.572036,0.863469 -0.801476,1.726938 -0.228571,2.590407 l 3.047542,0.228566 c 0.679011,2.273621 1.630084,4.00315 2.590413,5.714133 l 4.508653,0.16831 c 0.108315,-1.15859 -0.02335,-0.80349 0.360831,-2.611896 -1.235017,0.05123 -1.925316,0.02215 -3.142776,-0.04778 z"
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1.29825127px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccccc"
+         inkscape:connector-curvature="0"
+         id="path5178"
+         d="m -22.334932,51.601243 c 0.03917,5.884009 0.265917,11.78969 0.115055,16.956669 -4.797619,-5.826791 -6.000532,-6.87719 -14.110332,-8.400876 0.266048,-2.019106 5.124498,-8.160352 8.096482,-8.825452 z"
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1.29825127px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="csccccccc"
+         inkscape:connector-curvature="0"
+         id="path5248"
+         d="m -22.342019,75.908011 c -0.21864,-1.896417 -1.639002,-5.533526 -3.730067,-8.463135 -2.31979,-3.250055 -8.120538,-4.6395 -10.524676,-4.587544 -1.072241,2.513709 -2.372868,5.80951 -10.146798,6.630961 0,0.631156 -0.06417,3.053966 -0.07197,4.001862 -1.007086,0.06729 -2.60815,0.118058 -3.694251,0.04705 -0.198372,0.686616 -0.359385,2.050886 -0.327775,2.418476 9.184798,0.18599 19.417583,0.025 28.495537,-0.0477 z"
+         style="display:inline;fill:#0d00b4;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path5420"
+         d="m -36.380821,75.656271 6.520147,-11.490746"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path5437"
+         d="M -37.2644,75.721291 -37.399229,63.446514"
+         style="display:inline;fill:#000000;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         transform="matrix(-1.3208656,0.32230963,0.32230963,1.3208656,212.71465,-37.019854)"
+         d="m 205.65854,46.250197 -7.41812,-7.953301 2.39221,10.609472 -2.44764,-10.596824 -3.23301,10.384179 3.17869,-10.400935 -7.99196,7.376453 7.9533,-7.418125 -10.60947,2.392212 10.59682,-2.447634 -10.38418,-3.233019 10.40094,3.178699 -7.37646,-7.991966 7.41813,7.953301 -2.39221,-10.609472 2.44763,10.596824 3.23302,-10.384179 -3.1787,10.400935 7.99197,-7.376453 -7.9533,7.418125 10.60947,-2.392213 -10.59683,2.447634 10.38418,3.233019 -10.40093,-3.178698 z"
+         inkscape:randomized="0"
+         inkscape:rounded="0"
+         inkscape:flatsided="false"
+         sodipodi:arg2="1.0846132"
+         sodipodi:arg1="0.82281385"
+         sodipodi:r2="0.10981865"
+         sodipodi:r1="10.981865"
+         sodipodi:cy="38.199802"
+         sodipodi:cx="198.1891"
+         sodipodi:sides="12"
+         id="path5165"
+         style="display:inline;opacity:1;fill:url(#linearGradient5306);fill-opacity:1;stroke:#0d00b4;stroke-width:0.5;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal"
+         sodipodi:type="star" />
+      <path
+         sodipodi:nodetypes="cc"
+         inkscape:connector-curvature="0"
+         id="path5471"
+         d="m -35.521619,76.090441 11.393108,-6.84261"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         sodipodi:nodetypes="ccc"
+         inkscape:connector-curvature="0"
+         id="path5473"
+         d="m -38.0037,76.122451 -4.293111,-7.447646 v 0.06741"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         inkscape:connector-curvature="0"
+         id="path5475"
+         d="m -39.768755,76.090441 -7.550462,-4.179724"
+         style="display:inline;fill:none;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Symbol"
+     style="display:inline" />
+</svg>
diff --git a/client/public/images/pieces/Jiangqi/ba.svg b/client/public/images/pieces/Jiangqi/ba.svg
deleted file mode 120000
index b727f3e8..00000000
--- a/client/public/images/pieces/Jiangqi/ba.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/ba.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/bc.svg b/client/public/images/pieces/Jiangqi/bc.svg
deleted file mode 120000
index c7797929..00000000
--- a/client/public/images/pieces/Jiangqi/bc.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/bc.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/be.svg b/client/public/images/pieces/Jiangqi/be.svg
deleted file mode 120000
index 65da9376..00000000
--- a/client/public/images/pieces/Jiangqi/be.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/be.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/bk.svg b/client/public/images/pieces/Jiangqi/bk.svg
deleted file mode 120000
index d88bff5a..00000000
--- a/client/public/images/pieces/Jiangqi/bk.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/bk.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/bn.svg b/client/public/images/pieces/Jiangqi/bn.svg
deleted file mode 120000
index 31d112e0..00000000
--- a/client/public/images/pieces/Jiangqi/bn.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/bn.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/bp.svg b/client/public/images/pieces/Jiangqi/bp.svg
deleted file mode 120000
index 6cb84a94..00000000
--- a/client/public/images/pieces/Jiangqi/bp.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/bp.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/br.svg b/client/public/images/pieces/Jiangqi/br.svg
deleted file mode 120000
index d7ce7a3c..00000000
--- a/client/public/images/pieces/Jiangqi/br.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/br.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/wa.svg b/client/public/images/pieces/Jiangqi/wa.svg
deleted file mode 120000
index fcf50d06..00000000
--- a/client/public/images/pieces/Jiangqi/wa.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/wa.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/wc.svg b/client/public/images/pieces/Jiangqi/wc.svg
deleted file mode 120000
index d1634561..00000000
--- a/client/public/images/pieces/Jiangqi/wc.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/wc.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/we.svg b/client/public/images/pieces/Jiangqi/we.svg
deleted file mode 120000
index ecaa730a..00000000
--- a/client/public/images/pieces/Jiangqi/we.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/we.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/wk.svg b/client/public/images/pieces/Jiangqi/wk.svg
deleted file mode 120000
index ef1cfacb..00000000
--- a/client/public/images/pieces/Jiangqi/wk.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/wk.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/wn.svg b/client/public/images/pieces/Jiangqi/wn.svg
deleted file mode 120000
index 9cef643a..00000000
--- a/client/public/images/pieces/Jiangqi/wn.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/wn.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/wp.svg b/client/public/images/pieces/Jiangqi/wp.svg
deleted file mode 120000
index c9d9dfcb..00000000
--- a/client/public/images/pieces/Jiangqi/wp.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/wp.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Jiangqi/wr.svg b/client/public/images/pieces/Jiangqi/wr.svg
deleted file mode 120000
index db0b4e16..00000000
--- a/client/public/images/pieces/Jiangqi/wr.svg
+++ /dev/null
@@ -1 +0,0 @@
-../Xiangqi/wr.svg
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/bb.png b/client/public/images/pieces/Pacosako/bb.png
new file mode 120000
index 00000000..6dfdf95a
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bb.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/bb.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/bc.png b/client/public/images/pieces/Pacosako/bc.png
new file mode 100644
index 00000000..34736e72
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bc.png
@@ -0,0 +1 @@
+#$# git-fat c923a195b03eae0366704e353688c55e7b173bfc                 2706
diff --git a/client/public/images/pieces/Pacosako/bd.png b/client/public/images/pieces/Pacosako/bd.png
new file mode 100644
index 00000000..29dcf350
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bd.png
@@ -0,0 +1 @@
+#$# git-fat 72c532657b236e21574789a38b1b9a63a318839d                 3821
diff --git a/client/public/images/pieces/Pacosako/be.png b/client/public/images/pieces/Pacosako/be.png
new file mode 100644
index 00000000..4d63aef3
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/be.png
@@ -0,0 +1 @@
+#$# git-fat aeeb5993fa87747c1a0a922d253504344be3f683                 3988
diff --git a/client/public/images/pieces/Pacosako/bf.png b/client/public/images/pieces/Pacosako/bf.png
new file mode 100644
index 00000000..08b6c07a
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bf.png
@@ -0,0 +1 @@
+#$# git-fat 502509595db9fa2e00dcc7c6845705caf3f3a27c                 5346
diff --git a/client/public/images/pieces/Pacosako/bg.png b/client/public/images/pieces/Pacosako/bg.png
new file mode 100644
index 00000000..91e0064b
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bg.png
@@ -0,0 +1 @@
+#$# git-fat b200cec67c9b9b7d425874d13abafdaf4b67c16f                 4419
diff --git a/client/public/images/pieces/Pacosako/bi.png b/client/public/images/pieces/Pacosako/bi.png
new file mode 100644
index 00000000..4378c338
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bi.png
@@ -0,0 +1 @@
+#$# git-fat b00ea11fd8dd3edd9d48341029d136d158249dc1                 3780
diff --git a/client/public/images/pieces/Pacosako/bj.png b/client/public/images/pieces/Pacosako/bj.png
new file mode 100644
index 00000000..a5049697
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bj.png
@@ -0,0 +1 @@
+#$# git-fat 78be9912866d7b30f07ef561920301c47868ec00                 4041
diff --git a/client/public/images/pieces/Pacosako/bk.png b/client/public/images/pieces/Pacosako/bk.png
new file mode 120000
index 00000000..5779820a
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bk.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/bk.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/bl.png b/client/public/images/pieces/Pacosako/bl.png
new file mode 100644
index 00000000..8b884cc7
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bl.png
@@ -0,0 +1 @@
+#$# git-fat 01d6e9e99c69717b3640f6e305b288bf382c35a2                 5272
diff --git a/client/public/images/pieces/Pacosako/bm.png b/client/public/images/pieces/Pacosako/bm.png
new file mode 100644
index 00000000..1ef39621
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bm.png
@@ -0,0 +1 @@
+#$# git-fat 5b4f1c0f178dbb1e32e57b3d5cd317b5d2e9700a                 4370
diff --git a/client/public/images/pieces/Pacosako/bn.png b/client/public/images/pieces/Pacosako/bn.png
new file mode 120000
index 00000000..45d65470
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bn.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/bn.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/bp.png b/client/public/images/pieces/Pacosako/bp.png
new file mode 120000
index 00000000..9fa31726
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bp.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/bp.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/bq.png b/client/public/images/pieces/Pacosako/bq.png
new file mode 120000
index 00000000..ca064fd4
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bq.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/bq.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/br.png b/client/public/images/pieces/Pacosako/br.png
new file mode 120000
index 00000000..cad7b691
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/br.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/br.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/bs.png b/client/public/images/pieces/Pacosako/bs.png
new file mode 100644
index 00000000..74ee3878
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bs.png
@@ -0,0 +1 @@
+#$# git-fat 1241f4fccd0e97f7a13c598a64f9a04b703d887c                 4928
diff --git a/client/public/images/pieces/Pacosako/bt.png b/client/public/images/pieces/Pacosako/bt.png
new file mode 100644
index 00000000..5bd34c61
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bt.png
@@ -0,0 +1 @@
+#$# git-fat 776889a3271feec32ae8d592b61c9e76411474f3                 6163
diff --git a/client/public/images/pieces/Pacosako/bu.png b/client/public/images/pieces/Pacosako/bu.png
new file mode 100644
index 00000000..ebc3b74f
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bu.png
@@ -0,0 +1 @@
+#$# git-fat 201155639a4aed6884cb0a3afef6fb05ab3878a4                 5282
diff --git a/client/public/images/pieces/Pacosako/bw.png b/client/public/images/pieces/Pacosako/bw.png
new file mode 100644
index 00000000..b97ead79
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bw.png
@@ -0,0 +1 @@
+#$# git-fat c094793364191f90de072c3c5f6d1940a2faf983                 5947
diff --git a/client/public/images/pieces/Pacosako/bx.png b/client/public/images/pieces/Pacosako/bx.png
new file mode 100644
index 00000000..adc245bb
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bx.png
@@ -0,0 +1 @@
+#$# git-fat eaaf16b85d88183f46455217fd23e0f3b4ee670a                 5082
diff --git a/client/public/images/pieces/Pacosako/bz.png b/client/public/images/pieces/Pacosako/bz.png
new file mode 100644
index 00000000..28aadd88
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/bz.png
@@ -0,0 +1 @@
+#$# git-fat e2a7e4afc31c18369198b0d6133a57f702dc6a47                 6347
diff --git a/client/public/images/pieces/Pacosako/script.sh b/client/public/images/pieces/Pacosako/script.sh
new file mode 100644
index 00000000..9eeae02f
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/script.sh
@@ -0,0 +1,15 @@
+color=w
+for piece in p r n b q k; do
+  convert "$color""$piece".png -crop 100x128+0+0 "$color""$piece"_.png
+done
+color=b
+for piece in p r n b q k; do
+  convert "$color""$piece".png -crop 100x128+28+0 "$color""$piece"_.png
+done
+for p1 in p r n b q k; do
+  for p2 in p r n b q k; do
+    convert +append w"$p1"_.png b"$p2"_.png out_"$p1""$p2".png
+    convert out_"$p1""$p2".png -resize 128x128\! res_"$p1""$p2".png
+  done
+done
+# Finally: manual renaming + cleaning (TODO)
diff --git a/client/public/images/pieces/Pacosako/wa.png b/client/public/images/pieces/Pacosako/wa.png
new file mode 100644
index 00000000..d44021cd
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wa.png
@@ -0,0 +1 @@
+#$# git-fat 2423a8d5213d6a4d7a08024e254badf49138aa99                 2978
diff --git a/client/public/images/pieces/Pacosako/wb.png b/client/public/images/pieces/Pacosako/wb.png
new file mode 120000
index 00000000..36a1712c
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wb.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/wb.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/wc.png b/client/public/images/pieces/Pacosako/wc.png
new file mode 100644
index 00000000..cbf938ab
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wc.png
@@ -0,0 +1 @@
+#$# git-fat ee755a61be3d7abcc28413a37a3089ac7b3db5a1                 3100
diff --git a/client/public/images/pieces/Pacosako/wd.png b/client/public/images/pieces/Pacosako/wd.png
new file mode 100644
index 00000000..dfe0a5f9
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wd.png
@@ -0,0 +1 @@
+#$# git-fat e890701ec4dd383538910b06d905929ed5ed5a1b                 4021
diff --git a/client/public/images/pieces/Pacosako/we.png b/client/public/images/pieces/Pacosako/we.png
new file mode 100644
index 00000000..3df66e54
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/we.png
@@ -0,0 +1 @@
+#$# git-fat a2877ac3b0998751ebbee82ec80282354933739a                 3843
diff --git a/client/public/images/pieces/Pacosako/wf.png b/client/public/images/pieces/Pacosako/wf.png
new file mode 100644
index 00000000..b9930cac
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wf.png
@@ -0,0 +1 @@
+#$# git-fat c6e18be2909c53b77a824ddd6621a6bf4abd3cf8                 5102
diff --git a/client/public/images/pieces/Pacosako/wg.png b/client/public/images/pieces/Pacosako/wg.png
new file mode 100644
index 00000000..83086f18
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wg.png
@@ -0,0 +1 @@
+#$# git-fat 4fe66b51820d1fef4b6135c6a2b9452652474c1b                 5525
diff --git a/client/public/images/pieces/Pacosako/wh.png b/client/public/images/pieces/Pacosako/wh.png
new file mode 100644
index 00000000..6a7cf3fa
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wh.png
@@ -0,0 +1 @@
+#$# git-fat 16dfe13622026fde53c952688fec72df696d0421                 2505
diff --git a/client/public/images/pieces/Pacosako/wi.png b/client/public/images/pieces/Pacosako/wi.png
new file mode 100644
index 00000000..97719534
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wi.png
@@ -0,0 +1 @@
+#$# git-fat 85a2f36e164d1c2f8e358aab694958d65405bb80                 3672
diff --git a/client/public/images/pieces/Pacosako/wj.png b/client/public/images/pieces/Pacosako/wj.png
new file mode 100644
index 00000000..48f2e021
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wj.png
@@ -0,0 +1 @@
+#$# git-fat 5eaa7044a752bb84aacacaa99b41c8735cc219cd                 3394
diff --git a/client/public/images/pieces/Pacosako/wk.png b/client/public/images/pieces/Pacosako/wk.png
new file mode 120000
index 00000000..acf54001
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wk.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/wk.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/wl.png b/client/public/images/pieces/Pacosako/wl.png
new file mode 100644
index 00000000..1d9db579
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wl.png
@@ -0,0 +1 @@
+#$# git-fat 73c7b55f1c966502d35a4f308134bef0b1fd9fa1                 4703
diff --git a/client/public/images/pieces/Pacosako/wm.png b/client/public/images/pieces/Pacosako/wm.png
new file mode 100644
index 00000000..dc84be86
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wm.png
@@ -0,0 +1 @@
+#$# git-fat 15b404753feef33f1f9b55da91910c3bcd5953da                 5106
diff --git a/client/public/images/pieces/Pacosako/wn.png b/client/public/images/pieces/Pacosako/wn.png
new file mode 120000
index 00000000..4508036e
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wn.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/wn.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/wo.png b/client/public/images/pieces/Pacosako/wo.png
new file mode 100644
index 00000000..d2479af1
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wo.png
@@ -0,0 +1 @@
+#$# git-fat 5cd9e241fe740203cd499968d5d3123f1d099815                 4642
diff --git a/client/public/images/pieces/Pacosako/wp.png b/client/public/images/pieces/Pacosako/wp.png
new file mode 120000
index 00000000..b1c56708
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wp.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/wp.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/wq.png b/client/public/images/pieces/Pacosako/wq.png
new file mode 120000
index 00000000..536649a9
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wq.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/wq.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/wr.png b/client/public/images/pieces/Pacosako/wr.png
new file mode 120000
index 00000000..fb36f29e
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wr.png
@@ -0,0 +1 @@
+../Eightpieces/tmp_png/wr.png
\ No newline at end of file
diff --git a/client/public/images/pieces/Pacosako/ws.png b/client/public/images/pieces/Pacosako/ws.png
new file mode 100644
index 00000000..631520c8
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/ws.png
@@ -0,0 +1 @@
+#$# git-fat d125fdf6de53ae77f27fa02ff29be604c3e73af3                 4483
diff --git a/client/public/images/pieces/Pacosako/wt.png b/client/public/images/pieces/Pacosako/wt.png
new file mode 100644
index 00000000..1edf3d14
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wt.png
@@ -0,0 +1 @@
+#$# git-fat f4e2e81266970fb388d700e1ba5e34c58fd6a875                 5680
diff --git a/client/public/images/pieces/Pacosako/wu.png b/client/public/images/pieces/Pacosako/wu.png
new file mode 100644
index 00000000..cf980a38
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wu.png
@@ -0,0 +1 @@
+#$# git-fat e11742eb2d5c4e79a0c44f61fb4c8701f3006872                 6037
diff --git a/client/public/images/pieces/Pacosako/wv.png b/client/public/images/pieces/Pacosako/wv.png
new file mode 100644
index 00000000..6165b802
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wv.png
@@ -0,0 +1 @@
+#$# git-fat 6b192baf3110f21fdf9c2aa403138d3d299cb5a6                 4478
diff --git a/client/public/images/pieces/Pacosako/ww.png b/client/public/images/pieces/Pacosako/ww.png
new file mode 100644
index 00000000..b51e97f5
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/ww.png
@@ -0,0 +1 @@
+#$# git-fat bb1d8c496f6bddd6a80c1951658ab148877bf634                 5889
diff --git a/client/public/images/pieces/Pacosako/wx.png b/client/public/images/pieces/Pacosako/wx.png
new file mode 100644
index 00000000..651d49c9
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wx.png
@@ -0,0 +1 @@
+#$# git-fat 997ff8534319e10b3728181ac5fce6fdb888650a                 6417
diff --git a/client/public/images/pieces/Pacosako/wy.png b/client/public/images/pieces/Pacosako/wy.png
new file mode 100644
index 00000000..934a7176
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wy.png
@@ -0,0 +1 @@
+#$# git-fat b186625508f31d769f1abbe1b386ed7f8af91e8f                 6811
diff --git a/client/public/images/pieces/Pacosako/wz.png b/client/public/images/pieces/Pacosako/wz.png
new file mode 100644
index 00000000..bfe616d3
--- /dev/null
+++ b/client/public/images/pieces/Pacosako/wz.png
@@ -0,0 +1 @@
+#$# git-fat 1a0d3feeba3ad51a78558a861b6466af8cb7c80f                 7666
diff --git a/client/src/base_rules.js b/client/src/base_rules.js
index 293e933d..e91a43e8 100644
--- a/client/src/base_rules.js
+++ b/client/src/base_rules.js
@@ -112,7 +112,7 @@ export const ChessRules = class ChessRules {
     return false;
   }
 
-  // Some games are drawn unusually (bottomr right corner is black)
+  // Some games are drawn unusually (bottom right corner is black)
   static get DarkBottomRight() {
     return false;
   }
@@ -197,7 +197,7 @@ export const ChessRules = class ChessRules {
         if (V.PIECES.includes(row[i].toLowerCase())) sumElts++;
         else {
           const num = parseInt(row[i], 10);
-          if (isNaN(num)) return false;
+          if (isNaN(num) || num <= 0) return false;
           sumElts += num;
         }
       }
@@ -653,14 +653,14 @@ export const ChessRules = class ChessRules {
   // MOVES GENERATION
 
   // All possible moves from selected square
-  getPotentialMovesFrom([x, y]) {
-    switch (this.getPiece(x, y)) {
-      case V.PAWN: return this.getPotentialPawnMoves([x, y]);
-      case V.ROOK: return this.getPotentialRookMoves([x, y]);
-      case V.KNIGHT: return this.getPotentialKnightMoves([x, y]);
-      case V.BISHOP: return this.getPotentialBishopMoves([x, y]);
-      case V.QUEEN: return this.getPotentialQueenMoves([x, y]);
-      case V.KING: return this.getPotentialKingMoves([x, y]);
+  getPotentialMovesFrom(sq) {
+    switch (this.getPiece(sq[0], sq[1])) {
+      case V.PAWN: return this.getPotentialPawnMoves(sq);
+      case V.ROOK: return this.getPotentialRookMoves(sq);
+      case V.KNIGHT: return this.getPotentialKnightMoves(sq);
+      case V.BISHOP: return this.getPotentialBishopMoves(sq);
+      case V.QUEEN: return this.getPotentialQueenMoves(sq);
+      case V.KING: return this.getPotentialKingMoves(sq);
     }
     return []; //never reached
   }
@@ -675,8 +675,8 @@ export const ChessRules = class ChessRules {
         new PiPo({
           x: ex,
           y: ey,
-          c: tr ? tr.c : initColor,
-          p: tr ? tr.p : initPiece
+          c: !!tr ? tr.c : initColor,
+          p: !!tr ? tr.p : initPiece
         })
       ],
       vanish: [
diff --git a/client/src/components/Board.vue b/client/src/components/Board.vue
index d45f33b8..b8d0fadd 100644
--- a/client/src/components/Board.vue
+++ b/client/src/components/Board.vue
@@ -425,7 +425,7 @@ export default {
                   attrs: {
                     src:
                       "/images/pieces/" +
-                      // orientation: extra arg useful for some variants:
+                      // orientation: extra arg useful for some variants
                       this.vr.getPPpath(m, this.orientation) +
                       V.IMAGE_EXTENSION
                   },
diff --git a/client/src/translations/en.js b/client/src/translations/en.js
index c01b09ae..be4811e5 100644
--- a/client/src/translations/en.js
+++ b/client/src/translations/en.js
@@ -189,6 +189,7 @@ export const translations = {
   "Chinese Chess": "Chinese Chess",
   "Convert & support (v1)": "Convert & support (v1)",
   "Convert & support (v2)": "Convert & support (v2)",
+  "Dance with the King": "Dance with the King",
   "Dangerous captures": "Dangerous captures",
   "Dangerous collisions": "Dangerous collisions",
   "Double moves (v1)": "Double moves (v1)",
diff --git a/client/src/translations/es.js b/client/src/translations/es.js
index 629c6c00..017f45c0 100644
--- a/client/src/translations/es.js
+++ b/client/src/translations/es.js
@@ -189,6 +189,7 @@ export const translations = {
   "Chinese Chess": "Ajedrez chino",
   "Convert & support (v1)": "Convertir & apoyar (v1)",
   "Convert & support (v2)": "Convertir & apoyar (v2)",
+  "Dance with the King": "Baila con el Rey",
   "Dangerous captures": "Capturas peligrosas",
   "Dangerous collisions": "Colisiones peligrosas",
   "Double moves (v1)": "Jugadas doble (v1)",
diff --git a/client/src/translations/faq/en.pug b/client/src/translations/faq/en.pug
index e1479337..0f914b71 100644
--- a/client/src/translations/faq/en.pug
+++ b/client/src/translations/faq/en.pug
@@ -133,7 +133,7 @@
       If your opponent also quits the game after playing, then the time is
       just frozen - and you can decide to continue it later.
   | The rational behind this is that you don't know what the opponent played,
-  | so your clock shouldn't be running. Ans it also allows to take a break in
+  | so your clock shouldn't be running. And it also allows to take a break in
   | long live games, like maybe 1h30 + 30s.
 
 .question.
diff --git a/client/src/translations/fr.js b/client/src/translations/fr.js
index 1d18d17c..6b1f25c6 100644
--- a/client/src/translations/fr.js
+++ b/client/src/translations/fr.js
@@ -189,6 +189,7 @@ export const translations = {
   "Chinese Chess": "Échecs chinois",
   "Convert & support (v1)": "Convertir & soutenir (v1)",
   "Convert & support (v2)": "Convertir & soutenir (v2)",
+  "Dance with the King": "Dansez avec le Roi",
   "Dangerous captures": "Captures dangeureuses",
   "Dangerous collisions": "Collisions dangeureuses",
   "Double moves (v1)": "Coups doubles (v1)",
diff --git a/client/src/translations/rules/Checkered1/en.pug b/client/src/translations/rules/Checkered1/en.pug
index 4103caa3..8ea482cc 100644
--- a/client/src/translations/rules/Checkered1/en.pug
+++ b/client/src/translations/rules/Checkered1/en.pug
@@ -66,7 +66,7 @@ p.
   white is unable to "give back the turn".
   Without the black bishop on a7 it would be mate (without debate), because
   the king could virtually go to g1 before being captured by the
-  pawn-chamaleon.
+  chameleon pawn.
 
 figure.diagram-container
   .diagram
diff --git a/client/src/translations/rules/Pacosako/en.pug b/client/src/translations/rules/Pacosako/en.pug
new file mode 100644
index 00000000..6fe1bc10
--- /dev/null
+++ b/client/src/translations/rules/Pacosako/en.pug
@@ -0,0 +1,13 @@
+p.boxed TODO
+
+p WARNING 1: totally buggish right now.
+
+p WARNING 2: this variant may in the end not be playable here at all - will depend on the author decision.
+
+p
+  a(href="https://www.youtube.com/watch?v=tQ2JLsFvfxI") Video
+  | &nbsp;showing gameplay. See also 
+  a(href="http://pacosako.com/") the main website
+  | , and the associated
+  a(href="http://pacoplay.com/") playing area
+  | .
diff --git a/client/src/translations/rules/Pacosako/es.pug b/client/src/translations/rules/Pacosako/es.pug
new file mode 100644
index 00000000..6fe1bc10
--- /dev/null
+++ b/client/src/translations/rules/Pacosako/es.pug
@@ -0,0 +1,13 @@
+p.boxed TODO
+
+p WARNING 1: totally buggish right now.
+
+p WARNING 2: this variant may in the end not be playable here at all - will depend on the author decision.
+
+p
+  a(href="https://www.youtube.com/watch?v=tQ2JLsFvfxI") Video
+  | &nbsp;showing gameplay. See also 
+  a(href="http://pacosako.com/") the main website
+  | , and the associated
+  a(href="http://pacoplay.com/") playing area
+  | .
diff --git a/client/src/translations/rules/Pacosako/fr.pug b/client/src/translations/rules/Pacosako/fr.pug
new file mode 100644
index 00000000..6fe1bc10
--- /dev/null
+++ b/client/src/translations/rules/Pacosako/fr.pug
@@ -0,0 +1,13 @@
+p.boxed TODO
+
+p WARNING 1: totally buggish right now.
+
+p WARNING 2: this variant may in the end not be playable here at all - will depend on the author decision.
+
+p
+  a(href="https://www.youtube.com/watch?v=tQ2JLsFvfxI") Video
+  | &nbsp;showing gameplay. See also 
+  a(href="http://pacosako.com/") the main website
+  | , and the associated
+  a(href="http://pacoplay.com/") playing area
+  | .
diff --git a/client/src/translations/variants/en.pug b/client/src/translations/variants/en.pug
index 99fd2c12..9c68b678 100644
--- a/client/src/translations/variants/en.pug
+++ b/client/src/translations/variants/en.pug
@@ -400,6 +400,7 @@ p.
     "Gridolina",
     "Hamilton",
     "Magnetic",
+    "Pacosako",
     "Parachute",
     "Takenmake",
     "Titan",
diff --git a/client/src/variants/Janggi.js b/client/src/variants/Janggi.js
index e22a7869..27342422 100644
--- a/client/src/variants/Janggi.js
+++ b/client/src/variants/Janggi.js
@@ -52,7 +52,7 @@ export class JanggiRules extends ChessRules {
   }
 
   getPpath(b) {
-    return "Jiangqi/" + b;
+    return "Janggi/" + b;
   }
 
   static get size() {
diff --git a/client/src/variants/Pacosako.js b/client/src/variants/Pacosako.js
new file mode 100644
index 00000000..430cfb0a
--- /dev/null
+++ b/client/src/variants/Pacosako.js
@@ -0,0 +1,336 @@
+import { ChessRules, PiPo, Move } from "@/base_rules";
+import { randInt } from "@/utils/alea";
+
+export class PacosakoRules extends ChessRules {
+
+  static get IMAGE_EXTENSION() {
+    return ".png";
+  }
+
+  // Unions (left = white if upperCase, black otherwise)
+  static get UNIONS() {
+    return {
+      a: ['p', 'p'],
+      c: ['p', 'r'],
+      d: ['p', 'n'],
+      e: ['p', 'b'],
+      f: ['p', 'q'],
+      g: ['p', 'k'],
+      h: ['r', 'r'],
+      i: ['r', 'n'],
+      j: ['r', 'b'],
+      l: ['r', 'q'],
+      m: ['r', 'k'],
+      o: ['n', 'n'],
+      s: ['n', 'b'],
+      t: ['n', 'q'],
+      u: ['n', 'k'],
+      v: ['b', 'b'],
+      w: ['b', 'q'],
+      x: ['b', 'k'],
+      y: ['q', 'q'],
+      z: ['q', 'k']
+    };
+  }
+
+  static IsGoodPosition(position) {
+    if (position.length == 0) return false;
+    const rows = position.split("/");
+    if (rows.length != V.size.x) return false;
+    let kingSymb = ['k', 'g', 'm', 'u', 'x'];
+    let kings = { 'k': 0, 'K': 0 };
+    for (let row of rows) {
+      let sumElts = 0;
+      for (let i = 0; i < row.length; i++) {
+        const lowR = row[i].toLowerCase
+        if (!!(row[i].toLowerCase().match(/[a-z]/))) {
+          sumElts++;
+          if (kingSymb.includes(row[i])) kings['k']++;
+          else if (kingSymb.some(s => row[i] == s.toUpperCase())) kings['K']++;
+        }
+        else {
+          const num = parseInt(row[i], 10);
+          if (isNaN(num) || num <= 0) return false;
+          sumElts += num;
+        }
+      }
+      if (sumElts != V.size.y) return false;
+    }
+    // Both kings should be on board. Exactly one per color.
+    if (Object.values(kings).some(v => v != 1)) return false;
+    return true;
+  }
+
+  getPpath(b) {
+    return "Pacosako/" + b;
+  }
+
+  getPPath(m) {
+    if (ChessRules.PIECES.includes(m.appear[0].p)) return super.getPPpath(m);
+    // For an union, show only relevant piece:
+    // The color must be deduced from the move: reaching final rank of who?
+    const color = (m.appear[0].x == 0 ? 'b' : 'w');
+    const up = this.getUnionPieces(color, m.appear[0].p);
+    return color + up[color];
+  }
+
+  canTake([x1, y1], [x2, y2]) {
+    const c1 = this.getColor(x1, y1);
+    const c2 = this.getColor(x2, y2);
+    return (c1 != 'u' && c2 != c1);
+  }
+
+  canIplay(side, [x, y]) {
+    return this.turn == side && this.getColor(x, y) != V.GetOppCol(side);
+  }
+
+  scanKings(fen) {
+    this.kingPos = { w: [-1, -1], b: [-1, -1] };
+    const fenRows = V.ParseFen(fen).position.split("/");
+    const startRow = { 'w': V.size.x - 1, 'b': 0 };
+    const kingSymb = ['k', 'g', 'm', 'u', 'x'];
+    for (let i = 0; i < fenRows.length; i++) {
+      let k = 0;
+      for (let j = 0; j < fenRows[i].length; j++) {
+        const c = fenRows[i].charAt(j);
+        if (kingSymb.includes(c))
+          this.kingPos["b"] = [i, k];
+        else if (kingSymb.some(s => c == s.toUpperCase()))
+          this.kingPos["w"] = [i, k];
+        else {
+          const num = parseInt(fenRows[i].charAt(j), 10);
+          if (!isNaN(num)) k += num - 1;
+        }
+        k++;
+      }
+    }
+  }
+
+  setOtherVariables(fen) {
+    super.setOtherVariables(fen);
+    // Stack of "last move" only for intermediate chaining
+    this.lastMoveEnd = [null];
+  }
+
+  getColor(i, j) {
+    const p = this.board[i][j].charAt(1);
+    if (ChessRules.PIECES.includes(p)) return super.getColor(i, j);
+    return 'u'; //union
+  }
+
+  getPiece(i, j, color) {
+    const p = this.board[i][j].charAt(1);
+
+console.log(p);
+
+    if (ChessRules.PIECES.includes(p)) return p;
+    const c = this.board[i][j].charAt(0);
+    // NOTE: this.turn == HACK, but should work...
+    color = color || this.turn;
+    return V.UNIONS[p][c == color ? 0 : 1];
+  }
+
+  getUnionPieces(color, code) {
+    const pieces = V.UNIONS[code];
+    return {
+      w: pieces[color == 'w' ? 0 : 1],
+      b: pieces[color == 'b' ? 0 : 1]
+    };
+  }
+
+  getUnionCode(p1, p2) {
+    let uIdx = (
+      Object.values(V.UNIONS).findIndex(v => v[0] == p1 && v[1] == p2)
+    );
+    const c = (uIdx >= 0 ? 'w' : 'b');
+    if (uIdx == -1) {
+      uIdx = (
+        Object.values(V.UNIONS).findIndex(v => v[0] == p2 && v[1] == p1)
+      );
+    }
+    return { c: c, p: Object.keys(V.UNIONS)[uIdx] };
+  }
+
+  getBasicMove([sx, sy], [ex, ey], tr) {
+    const initColor = this.board[sx][sy].charAt(0);
+    const initPiece = this.board[sx][sy].charAt(1);
+    // 4 cases : moving
+    //  - union to free square (other cases are illegal: return null)
+    //  - normal piece to free square,
+    //                 to enemy normal piece, or
+    //                 to union (releasing our piece)
+    let mv = new Move({
+      vanish: [
+        new PiPo({
+          x: sx,
+          y: sy,
+          c: initColor,
+          p: initPiece
+        })
+      ],
+      end: { x: ex, y: ey }
+    });
+    // Treat free square cases first:
+    if (this.board[ex][ey] == V.EMPTY) {
+      mv.appear = [
+        new PiPo({
+          x: ex,
+          y: ey,
+          c: initColor,
+          p: !!tr ? tr.p : initPiece
+        })
+      ];
+      return mv;
+    }
+    // Now the two cases with union / release:
+    const destColor = this.board[ex][ey].charAt(0);
+    const destPiece = this.board[ex][ey].charAt(1);
+    mv.vanish.push(
+      new PiPo({
+        x: ex,
+        y: ey,
+        c: destColor,
+        p: destPiece
+      })
+    );
+    if (ChessRules.PIECES.includes(destPiece)) {
+      // Normal piece: just create union
+      const cp = this.getUnionCode(!!tr ? tr.p : initPiece, destPiece);
+      mv.appear = [
+        new PiPo({
+          x: ex,
+          y: ey,
+          c: cp.c,
+          p: cp.p
+        })
+      ];
+      return mv;
+    }
+    // Releasing a piece in an union: keep track of released piece
+    const up = this.getUnionPieces(destColor, destPiece);
+    const c = this.turn;
+    const oppCol = V.GetOppCol(c);
+    const cp = this.getUnionCode(!!tr ? tr.p : initPiece, up[oppCol])
+    mv.appear = [
+      new PiPo({
+        x: ex,
+        y: ey,
+        c: cp.c,
+        p: cp.p
+      })
+    ];
+    mv.released = up[c];
+    return mv;
+  }
+
+  getPotentialMoves([x, y]) {
+    const L = this.lastMoveEnd.length;
+    const lm = this.lastMoveEnd[L-1];
+    let piece = null;
+    if (!!lm) {
+      if (x != lm.x || y != lm.y) return [];
+      piece = lm.p;
+    }
+    if (!!piece) {
+      var unionOnBoard = this.board[x][y];
+      this.board[x][y] = this.turn + piece;
+    }
+    let baseMoves = [];
+    switch (piece || this.getPiece(x, y)) {
+      case V.PAWN:
+        baseMoves = this.getPotentialPawnMoves([x, y]);
+        break;
+      case V.ROOK:
+        baseMoves = this.getPotentialRookMoves([x, y]);
+        break;
+      case V.KNIGHT:
+        baseMoves = this.getPotentialKnightMoves([x, y]);
+        break;
+      case V.BISHOP:
+        baseMoves = this.getPotentialBishopMoves([x, y]);
+        break;
+      case V.QUEEN:
+        baseMoves = this.getPotentialQueenMoves([x, y]);
+        break;
+      case V.KING:
+        baseMoves = this.getPotentialKingMoves([x, y]);
+        break;
+    }
+    // When a pawn in an union reaches final rank with a non-standard
+    // promotion move: apply promotion anyway
+    let moves = [];
+    baseMoves.forEach(m => {
+      // (move to first rank, which is last rank for opponent [pawn]), should show promotion choices.
+      //if (m. //bring enemy pawn to his first rank ==> union types involved... color...
+      moves.push(m); //TODO
+    });
+    if (!!piece) this.board[x][y] = unionOnBoard;
+    return moves;
+  }
+
+  play(move) {
+    this.epSquares.push(this.getEpSquare(move));
+    // Check if the move is the last of the turn: all cases except releases
+    move.last = (
+      move.vanish.length == 1 ||
+      ChessRules.PIECES.includes(move.vanish[1].p)
+    );
+    if (move.last) {
+      // No more union releases available
+      this.turn = V.GetOppCol(this.turn);
+      this.movesCount++;
+      this.lastMoveEnd.push(null);
+    }
+    else {
+      const color = this.board[move.end.x][move.end.y].charAt(0);
+      const oldUnion = this.board[move.end.x][move.end.y].charAt(1);
+      const released = this.getUnionPieces(color, oldUnion)[this.turn];
+      this.lastMoveEnd.push(Object.assign({}, move.end, { p: released }));
+    }
+    V.PlayOnBoard(this.board, move);
+  }
+
+  undo(move) {
+    this.epSquares.pop();
+    V.UndoOnBoard(this.board, move);
+    this.lastMoveEnd.pop();
+    if (move.last) {
+      this.turn = V.GetOppCol(this.turn);
+      this.movesCount--;
+    }
+  }
+
+  getCurrentScore() {
+    // Check kings: if one is dancing, the side lost
+    const [kpW, kpB] = [this.kingPos['w'], this.kingPos['b']];
+    if (this.board[kpB[0]][kpB[1]].charAt(1) != 'k') return "1-0";
+    if (this.board[kpW[0]][kpW[1]].charAt(1) != 'k') return "0-1";
+    return "*";
+  }
+
+  getComputerMove() {
+    let moves = this.getAllValidMoves();
+    if (moves.length == 0) return null;
+    // Just play random moves (for now at least. TODO?)
+    let mvArray = [];
+    while (moves.length > 0) {
+      const mv = moves[randInt(moves.length)];
+      mvArray.push(mv);
+      this.play(mv);
+      if (!mv.last)
+        // A piece was just released from an union
+        moves = this.getPotentialMovesFrom([mv.end.x, mv.end.y]);
+      else break;
+    }
+    for (let i = mvArray.length - 1; i >= 0; i--) this.undo(mvArray[i]);
+    return (mvArray.length > 1 ? mvArray : mvArray[0]);
+  }
+
+  // NOTE: evalPosition() is wrong, but unused since bot plays at random
+
+  getNotation(move) {
+    // TODO: in case of enemy pawn promoted, add "=..." in the end
+    return super.getNotation(move);
+  }
+
+};
diff --git a/server/db/populate.sql b/server/db/populate.sql
index ce6fd393..7f4a7a3d 100644
--- a/server/db/populate.sql
+++ b/server/db/populate.sql
@@ -88,6 +88,7 @@ insert or ignore into Variants (name, description) values
   ('Ordamirror', 'Mongolian Horde (v2)'),
   ('Pacifist1', 'Convert & support (v1)'),
   ('Pacifist2', 'Convert & support (v2)'),
+  ('Pacosako', 'Dance with the King'),
   ('Parachute', 'Landing on the board'),
   ('Pawnmassacre', 'Pieces upside down'),
   ('Pawns', 'Reach the last rank (v1)'),
-- 
2.44.0