diff --git a/src/web/app/common/views/components/welcome-timeline.vue b/src/web/app/common/views/components/welcome-timeline.vue
index ab402f126a..2ff06e2cc0 100644
--- a/src/web/app/common/views/components/welcome-timeline.vue
+++ b/src/web/app/common/views/components/welcome-timeline.vue
@@ -78,14 +78,14 @@ export default Vue.extend({
 
 			> img
 				display block
-				width 36px
-				height 36px
+				width 42px
+				height 42px
 				border-radius 6px
 
 		> .body
 			float right
-			width calc(100% - 36px)
-			padding-left 8px
+			width calc(100% - 42px)
+			padding-left 12px
 
 			> header
 				display flex
diff --git a/src/web/app/desktop/views/pages/welcome.vue b/src/web/app/desktop/views/pages/welcome.vue
index 53ea99598d..5d1d4ad01b 100644
--- a/src/web/app/desktop/views/pages/welcome.vue
+++ b/src/web/app/desktop/views/pages/welcome.vue
@@ -70,9 +70,24 @@ export default Vue.extend({
 	display flex
 	flex-direction column
 	flex 1
-	background #eee
 	$width = 1000px
 
+	background-image url('/assets/welcome-bg.svg')
+	background-size cover
+	background-position top center
+
+	&:before
+		content ""
+		display block
+		position fixed
+		bottom 0
+		left 0
+		width 100%
+		height 100%
+		background-image url('/assets/welcome-fg.svg')
+		background-size cover
+		background-position bottom center
+
 	> main
 		display flex
 		flex 1
@@ -80,9 +95,6 @@ export default Vue.extend({
 		> .top
 			display flex
 			width 100%
-			background-image url('/assets/welcome.svg')
-			background-size cover
-			background-position top center
 
 			> div
 				display flex
@@ -92,7 +104,8 @@ export default Vue.extend({
 
 				> div:first-child
 					margin 0 48px 0 0
-					color #777
+					color #d1e6bf
+					text-shadow 0 0 12px #172062
 
 					> h1
 						margin 0
@@ -154,18 +167,19 @@ export default Vue.extend({
 							overflow auto
 
 	> footer
+		font-size 12px
 		color #949ea5
-		background #fff
 
 		> div
 			max-width $width
 			margin 0 auto
-			padding 42px 0
+			padding 0 0 42px 0
 			text-align center
 
 			> .c
 				margin 16px 0 0 0
 				font-size 10px
+				opacity 0.7
 
 </style>
 
@@ -194,3 +208,9 @@ export default Vue.extend({
 	a
 		color #666
 </style>
+
+<style lang="stylus">
+html
+body
+	background linear-gradient(to bottom, #1e1d65, #bd6659)
+</style>
diff --git a/src/web/assets/welcome.svg b/src/web/assets/welcome-bg.svg
similarity index 53%
rename from src/web/assets/welcome.svg
rename to src/web/assets/welcome-bg.svg
index fce566dd96..27ae4469f2 100644
--- a/src/web/assets/welcome.svg
+++ b/src/web/assets/welcome-bg.svg
@@ -17,9 +17,26 @@
    version="1.1"
    id="svg8"
    inkscape:version="0.92.1 r15371"
-   sodipodi:docname="描画.svg">
+   sodipodi:docname="welcome-bg.svg">
   <defs
      id="defs2">
+    <pattern
+       inkscape:collect="always"
+       xlink:href="#Checkerboard"
+       id="pattern7194"
+       patternTransform="scale(1.3152942)" />
+    <linearGradient
+       id="linearGradient7169"
+       inkscape:collect="always">
+      <stop
+         id="stop7165"
+         offset="0"
+         style="stop-color:#eaeaea;stop-opacity:1" />
+      <stop
+         id="stop7167"
+         offset="1"
+         style="stop-color:#000000;stop-opacity:1" />
+    </linearGradient>
     <linearGradient
        inkscape:collect="always"
        id="linearGradient7044">
@@ -44,7 +61,8 @@
        height="2"
        width="2"
        patternUnits="userSpaceOnUse"
-       inkscape:collect="always">
+       inkscape:collect="always"
+       inkscape:isstock="true">
       <rect
          id="rect6201"
          height="1"
@@ -68,10 +86,22 @@
          offset="0"
          id="stop5404" />
     </linearGradient>
+    <pattern
+       patternUnits="userSpaceOnUse"
+       width="15.999999"
+       height="16.000025"
+       patternTransform="matrix(0.26458333,0,0,0.26458333,-16.933332,263.1333)"
+       id="pattern6465">
+      <path
+         d="m 8.0000542,8.0000126 h 7.9998878 c 3e-5,0 5.7e-5,3.78e-5 5.7e-5,3.78e-5 V 15.99995 c 0,3.7e-5 -2.7e-5,7.5e-5 -5.7e-5,7.5e-5 H 8.0000542 c -3.03e-5,0 -5.67e-5,-3.8e-5 -5.67e-5,-7.5e-5 V 8.0000504 c 0,0 2.64e-5,-3.78e-5 5.67e-5,-3.78e-5 z M 5.6692913e-5,0 H 7.9999408 c 3.02e-5,0 5.67e-5,3.7795275e-5 5.67e-5,7.5590551e-5 V 7.999937 c 0,3.78e-5 -2.65e-5,7.56e-5 -5.67e-5,7.56e-5 H 5.6692913e-5 C 2.2677165e-5,8.0000126 0,7.9999748 0,7.999937 V 7.5590551e-5 C 0,3.7795276e-5 2.2677165e-5,0 5.6692913e-5,0 Z"
+         style="opacity:1;fill:#db1545;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:15.99999905;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="rect6445-2"
+         inkscape:connector-curvature="0" />
+    </pattern>
     <linearGradient
        inkscape:collect="always"
        xlink:href="#linearGradient7044"
-       id="linearGradient7064"
+       id="linearGradient6476"
        gradientUnits="userSpaceOnUse"
        gradientTransform="matrix(3.223659,0,0,2.5556636,-579.27357,808.39)"
        x1="86.490868"
@@ -80,30 +110,74 @@
        y2="-216.62756" />
     <mask
        maskUnits="userSpaceOnUse"
-       id="mask7060">
+       id="mask6472">
       <rect
-         style="opacity:1;fill:url(#linearGradient7064);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.92238116;stroke-miterlimit:4;stroke-dasharray:none"
-         id="rect7062"
-         width="291.06116"
-         height="511.36566"
-         x="-300.45657"
+         transform="rotate(-90)"
          y="-0.91986513"
-         transform="rotate(-90)" />
+         x="-300.45657"
+         height="511.36566"
+         width="291.06116"
+         id="rect6474"
+         style="opacity:1;fill:url(#linearGradient6476);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.92238116;stroke-miterlimit:4;stroke-dasharray:none" />
+    </mask>
+    <pattern
+       patternUnits="userSpaceOnUse"
+       width="2340.7208"
+       height="2340.7236"
+       patternTransform="matrix(0.26458333,0,0,0.26458333,-63.499801,-58.601683)"
+       id="pattern7142">
+      <path
+         d="m 1170.3684,1170.3628 h 1170.3448 c 0,0 0.01,0 0.01,0 v 1170.3457 c 0,0 0,0.011 -0.01,0.011 H 1170.3684 c 0,0 -0.01,0 -0.01,-0.011 v -1170.344 c 0,0 0,0 0.01,0 z M 0.00869291,1.1338583e-5 H 1170.352 c 0,0 0.01,0.0052913414 0.01,0.01096063142 V 1170.3511 c 0,0 0,0.011 -0.01,0.011 H 0.00869291 C 0.00340157,1170.3625 0,1170.3549 0,1170.3511 V 0.01096063 C 0,0.00566929 0.00312945,0 0.00869291,0 Z"
+         style="opacity:1;fill:#763971;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2340.72119141;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path7135"
+         inkscape:connector-curvature="0" />
+    </pattern>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7169"
+       id="linearGradient7157"
+       x1="-3.631536"
+       y1="155.11069"
+       x2="511.52777"
+       y2="155.11069"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(2.184742,0,0,6.5696504,-17.948376,-1979.8074)" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7169"
+       id="linearGradient7200"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.57804632,0,0,1.73822,6.5011419,-523.82404)"
+       x1="-3.631536"
+       y1="155.11069"
+       x2="511.52777"
+       y2="155.11069" />
+    <mask
+       maskUnits="userSpaceOnUse"
+       id="mask7196">
+      <rect
+         transform="rotate(90)"
+         y="-512.56537"
+         x="4.4019437"
+         height="516.7157"
+         width="297.78595"
+         id="rect7198"
+         style="opacity:1;fill:url(#linearGradient7200);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.1217103;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
     </mask>
   </defs>
   <sodipodi:namedview
      id="base"
-     pagecolor="#ffffff"
+     pagecolor="#1e1d65"
      bordercolor="#666666"
      borderopacity="1.0"
      inkscape:pageopacity="0.84705882"
      inkscape:pageshadow="2"
-     inkscape:zoom="0.51"
-     inkscape:cx="895.96593"
-     inkscape:cy="599.48775"
+     inkscape:zoom="0.6363961"
+     inkscape:cx="1046.85"
+     inkscape:cy="572.84089"
      inkscape:document-units="mm"
      inkscape:current-layer="layer1"
-     showgrid="false"
+     showgrid="true"
      units="px"
      inkscape:pagecheckerboard="true"
      inkscape:window-width="1920"
@@ -118,7 +192,23 @@
      inkscape:bbox-paths="true"
      inkscape:bbox-nodes="true"
      inkscape:snap-bbox-edge-midpoints="true"
-     inkscape:snap-bbox-midpoints="true" />
+     inkscape:snap-bbox-midpoints="true"
+     showguides="false">
+    <inkscape:grid
+       type="xygrid"
+       id="grid6443"
+       spacingx="2.1166667"
+       spacingy="2.1166667"
+       empspacing="4"
+       color="#3f3fff"
+       opacity="0.1254902"
+       enabled="false" />
+    <sodipodi:guide
+       position="-69.219003,3.872392"
+       orientation="1,0"
+       id="guide6508"
+       inkscape:locked="false" />
+  </sodipodi:namedview>
   <metadata
      id="metadata5">
     <rdf:RDF>
@@ -137,21 +227,23 @@
      id="layer1"
      transform="translate(0,-11.249983)">
     <rect
-       style="opacity:0.05;fill:url(#pattern7010);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.15551688;stroke-miterlimit:4;stroke-dasharray:none"
-       id="rect6987"
-       width="754.9812"
-       height="469.89072"
-       x="-83.816063"
-       y="-63.078693"
-       ry="0"
-       mask="url(#mask7060)" />
-    <path
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:0.26499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       d="m 149.59224,187.51883 -30.48108,6.4476 18.58548,61.14441 32.06774,-5.02079 2.27916,-39.16205 -20.18463,5.72179 z m -19.28212,12.50282 11.30447,-2.22985 0.81973,12.45223 -7.5888,1.65389 z m 15.28477,16.59486 0.74067,11.65353 -7.42226,2.02029 -3.70369,-10.82413 z m 1.61836,17.96698 1.20153,11.02325 -5.56723,1.37628 -3.18232,-10.49349 z m 14.34445,-2.69044 0.26461,11.20806 -5.86133,1.29523 -1.20102,-11.02336 z"
-       id="path5398"
-       inkscape:connector-curvature="0" />
+       style="opacity:0.2;fill:url(#pattern7194);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.11666656;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="rect7178"
+       width="568.07599"
+       height="367.82269"
+       x="-37.871731"
+       y="-52.665051"
+       mask="url(#mask7196)" />
+    <rect
+       style="fill:none;stroke:none;stroke-width:140.99996948;opacity:0.5"
+       width="596.8999"
+       height="596.90082"
+       x="-63.49987"
+       y="-58.600021"
+       id="rect6468"
+       mask="url(#mask6472)" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.35368672"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.35368672"
        id="path5309"
        cx="19.684303"
        cy="2.3963881"
@@ -159,21 +251,21 @@
        ry="51.621048"
        transform="matrix(0.99853597,-0.05409175,0,1,0,0)" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.26458332"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.26458332;opacity:0.64"
        id="path5313"
        cx="146.58771"
        cy="21.961346"
        rx="60.384743"
        ry="31.365929" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.22788492"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.22788492;opacity:0.68"
        id="path5313-3"
        cx="227.88307"
        cy="9.7990417"
        rx="51.849796"
        ry="27.098455" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.18895671"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.18895671;opacity:0.77000005"
        id="path5309-5"
        cx="158.05429"
        cy="9.211237"
@@ -181,7 +273,7 @@
        ry="25.06374"
        transform="matrix(0.99900149,0.04467679,0,-1,0,0)" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.19881381"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.19881381;opacity:0.65719996"
        id="path5309-5-5"
        cx="-320.59222"
        cy="-18.961536"
@@ -189,7 +281,7 @@
        ry="26.334759"
        transform="matrix(-0.99900701,0.04455336,0,-1,0,0)" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.2416939"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.2416939;opacity:0.44320004"
        id="path5309-0"
        cx="-474.55038"
        cy="-20.052439"
@@ -197,32 +289,14 @@
        ry="37.216171"
        transform="matrix(-0.99818591,-0.06020699,0,1,0,0)" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.26458332"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.26458332;opacity:0.78580004"
        id="path5313-5"
        cx="382.79236"
        cy="16.200251"
        rx="60.384743"
        ry="31.365929" />
-    <circle
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:1.99730551"
-       id="path5392"
-       cx="253.06117"
-       cy="887.61829"
-       r="642.68146" />
     <path
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       d="m 329.51477,199.15082 -32.04286,18.26817 12.8142,1.28619 -6.02656,28.18505 32.94792,3.49531 0.51681,-27.76301 11.91226,1.00737 z m -14.10711,25.93826 6.27123,0.90288 -1.15019,5.4805 -6.00929,-0.898 z m 13.58524,2.09643 0.42171,5.50053 -6.35262,-0.44337 1.22618,-5.67857 z m -15.04127,5.73678 6.21844,0.90138 -1.87301,4.94347 -5.07899,-0.81761 z m 8.80707,1.53673 6.3403,1.10313 0.43128,4.98637 -7.83808,-1.19409 z"
-       id="path6874"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="cccccccccccccccccccccccccccc" />
-    <path
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       d="m 366.28967,254.78298 7.49431,-30.40441 -7.41388,-2.66046 1.18763,-3.36104 7.21205,2.27141 1.38362,-5.73044 -7.20912,-2.66047 1.28561,-3.65794 7.01313,2.7643 2.17341,-7.01022 3.35519,1.48161 -2.1734,6.51147 6.70747,2.66046 -1.28564,3.16213 -6.31255,-2.46154 -1.68638,6.02735 6.80837,2.46447 -0.9887,3.84808 -6.90052,-2.47031 -6.71038,30.41026 z"
-       id="path6891"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ccccccccccccccccccccc" />
-    <path
-       style="fill:#000000;fill-opacity:0.09661835;fill-rule:nonzero;stroke:none;stroke-width:0.26499999;stroke-miterlimit:4;stroke-dasharray:none"
+       style="fill:#ffff7c;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.26499999;stroke-miterlimit:4;stroke-dasharray:none"
        d="m 377.25876,69.781182 a 18.234796,18.234796 0 0 1 8.1747,15.19442 18.234796,18.234796 0 0 1 -18.23455,18.235058 18.234796,18.234796 0 0 1 -10.14098,-3.08921 20.380066,20.380066 0 0 0 17.64905,10.2402 20.380066,20.380066 0 0 0 20.38015,-20.380152 20.380066,20.380066 0 0 0 -17.82837,-20.200316 z"
        id="path6914"
        inkscape:connector-curvature="0" />
@@ -309,50 +383,95 @@
        d="m 88.671168,129.31136 -1.220735,-1.13398 -1.639626,-0.2962 1.13398,-1.22073 0.296201,-1.63963 1.220735,1.13398 1.639625,0.2962 -1.13398,1.22074 z"
        inkscape:transform-center-x="2.4830149e-006"
        transform="matrix(0.91666667,0,0,1,7.1509005,0)" />
-    <path
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:0.99999994px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       d="M 278.09961 779.17383 L 273.55469 781.65234 L 282.30273 807.51562 L 265.05078 812.48633 L 316.54688 967.83984 L 396.62305 947.04297 L 369.47266 782.39453 L 286.1543 806.4043 L 278.09961 779.17383 z M 341.34766 817.19922 L 346.93555 855.88672 L 315.41797 863.33008 L 300.96094 827.68945 L 341.34766 817.19922 z M 355.63477 872.21094 L 358.58984 909.34961 L 332.12891 916.2207 L 318.54883 881.09766 L 355.63477 872.21094 z "
-       transform="matrix(0.26458333,0,0,0.26458333,0,11.249983)"
-       id="path6944" />
-    <path
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:0.24600939px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       d="m 43.603475,280.06036 -10.564819,-28.58824 -6.574764,2.28618 -0.916385,-3.37337 6.23111,-2.47535 -2.011396,-5.37101 -6.431418,2.16468 -1.002197,-3.66725 6.348194,-1.96596 -2.123972,-6.85578 3.11982,-0.81419 1.86458,6.45975 6.080155,-1.86705 0.744318,3.27357 -5.700174,1.79072 1.953823,5.78639 6.048884,-2.08256 1.308957,3.64208 -6.116434,2.13257 11.116753,28.12778 z"
-       id="path6891-8"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ccccccccccccccccccccc" />
-    <path
-       style="fill:#000000;fill-opacity:0.09661835;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       d="m 411.98753,264.70523 3.91734,-12.57157 -7.13355,-3.53259 -1.396,-8.02014 5.81668,-6.93436 10.92618,-0.52461 7.35863,5.88054 0.0806,8.11138 -5.67524,6.95564 -7.37536,-0.96565 -1.04168,4.03744 5.21293,-1.96321 1.42492,-6.58308 5.61592,-1.7579 5.33002,3.98422 -1.35343,5.14755 -3.67857,2.33882 -4.89966,-2.03926 -7.52592,2.91667 -1.60892,6.84465 z"
-       id="path6985"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ccccccccccccccccccccc" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.26458332"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.26458332;opacity:0.50920001"
        id="path5313-36"
        cx="12.969777"
        cy="40.717304"
        rx="60.384743"
        ry="31.365929" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.28271547"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.28271547;opacity:0.67880004"
        id="path5313-36-0"
        cx="525.27576"
        cy="33.454243"
        rx="68.944794"
        ry="31.365929" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.26458332"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.26458332;opacity:0.42"
        id="path5313-367"
        cx="91.30719"
        cy="8.5522709"
        rx="60.384743"
        ry="31.365929" />
     <ellipse
-       style="fill:#ffffff;fill-opacity:0.56038663;stroke:none;stroke-width:0.33264157"
+       style="fill:#6e76a3;fill-opacity:0.50241548;stroke:none;stroke-width:0.33264157;opacity:0.81720004"
        id="path5313-5-9"
        cx="445.12253"
        cy="3.1049659"
        rx="78.023628"
        ry="38.369606" />
+    <ellipse
+       style="opacity:0.68000034;fill:#6e76a3;fill-opacity:1;stroke:none;stroke-width:0.06383465"
+       id="path5313-3-7"
+       cx="181.50844"
+       cy="105.65076"
+       rx="21.691566"
+       ry="5.0825601" />
+    <ellipse
+       style="opacity:0.68000034;fill:#6e76a3;fill-opacity:1;stroke:none;stroke-width:0.08063243"
+       id="path5313-3-7-5"
+       cx="203.20001"
+       cy="111.49451"
+       rx="27.399597"
+       ry="6.4200115" />
+    <ellipse
+       style="opacity:0.68000034;fill:#6e76a3;fill-opacity:1;stroke:none;stroke-width:0.06734787"
+       id="path5313-3-7-2"
+       cx="-418.26395"
+       cy="129.96568"
+       rx="24.144913"
+       ry="5.0825605"
+       transform="scale(-1,1)" />
+    <ellipse
+       style="opacity:0.68000034;fill:#6e76a3;fill-opacity:1;stroke:none;stroke-width:0.08507013"
+       id="path5313-3-7-5-9"
+       cx="-394.11902"
+       cy="135.80943"
+       rx="30.498529"
+       ry="6.4200115"
+       transform="scale(-1,1)" />
+    <ellipse
+       style="opacity:0.68000034;fill:#6e76a3;fill-opacity:1;stroke:none;stroke-width:0.05208009"
+       id="path5313-3-7-2-9"
+       cx="-46.428764"
+       cy="163.90004"
+       rx="18.893074"
+       ry="3.884198"
+       transform="matrix(-0.99073724,0.13579293,0.14607844,0.98927301,0,0)" />
+    <ellipse
+       style="opacity:0.68000034;fill:#6e76a3;fill-opacity:1;stroke:none;stroke-width:0.06578472"
+       id="path5313-3-7-5-9-1"
+       cx="-27.535677"
+       cy="168.36595"
+       rx="23.864695"
+       ry="4.9063048"
+       transform="matrix(-0.99073724,0.13579293,0.14607844,0.98927301,0,0)" />
+    <path
+       sodipodi:type="star"
+       style="fill:#000000;fill-opacity:0.09661835;fill-rule:nonzero;stroke:none;stroke-width:0.26499999;stroke-miterlimit:4;stroke-dasharray:none"
+       id="path6923-9"
+       sodipodi:sides="4"
+       sodipodi:cx="459.82238"
+       sodipodi:cy="139.8455"
+       sodipodi:r1="3.949214"
+       sodipodi:r2="1.9746071"
+       sodipodi:arg1="1.6614562"
+       sodipodi:arg2="2.4468544"
+       inkscape:flatsided="false"
+       inkscape:rounded="0"
+       inkscape:randomized="0"
+       d="m 459.46484,143.7785 -1.15939,-2.66888 -2.41606,-1.62166 2.66889,-1.15939 1.62165,-2.41606 1.15939,2.66888 2.41606,1.62166 -2.66888,1.15939 z"
+       inkscape:transform-center-x="4.0000001e-006" />
   </g>
 </svg>
diff --git a/src/web/assets/welcome-fg.svg b/src/web/assets/welcome-fg.svg
new file mode 100644
index 0000000000..bc2c439dc8
--- /dev/null
+++ b/src/web/assets/welcome-fg.svg
@@ -0,0 +1,245 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
+   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="1920"
+   height="1080"
+   viewBox="0 0 507.99999 285.75001"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.1 r15371"
+   sodipodi:docname="welcome-fg.svg">
+  <defs
+     id="defs2">
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient7044">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop7040" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:1"
+         offset="1"
+         id="stop7042" />
+    </linearGradient>
+    <pattern
+       inkscape:collect="always"
+       xlink:href="#Checkerboard"
+       id="pattern7010"
+       patternTransform="matrix(1.673813,0,0,1.673813,-177.6001,-146.38611)" />
+    <pattern
+       inkscape:stockid="Checkerboard"
+       id="Checkerboard"
+       patternTransform="translate(0,0) scale(10,10)"
+       height="2"
+       width="2"
+       patternUnits="userSpaceOnUse"
+       inkscape:collect="always">
+      <rect
+         id="rect6201"
+         height="1"
+         width="1"
+         y="0"
+         x="0"
+         style="fill:black;stroke:none" />
+      <rect
+         id="rect6203"
+         height="1"
+         width="1"
+         y="1"
+         x="1"
+         style="fill:black;stroke:none" />
+    </pattern>
+    <linearGradient
+       id="linearGradient5406"
+       osb:paint="solid">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop5404" />
+    </linearGradient>
+    <pattern
+       patternUnits="userSpaceOnUse"
+       width="15.999999"
+       height="16.000025"
+       patternTransform="matrix(0.26458333,0,0,0.26458333,-16.933332,263.1333)"
+       id="pattern6465">
+      <path
+         d="m 8.0000542,8.0000126 h 7.9998878 c 3e-5,0 5.7e-5,3.78e-5 5.7e-5,3.78e-5 V 15.99995 c 0,3.7e-5 -2.7e-5,7.5e-5 -5.7e-5,7.5e-5 H 8.0000542 c -3.03e-5,0 -5.67e-5,-3.8e-5 -5.67e-5,-7.5e-5 V 8.0000504 c 0,0 2.64e-5,-3.78e-5 5.67e-5,-3.78e-5 z M 5.6692913e-5,0 H 7.9999408 c 3.02e-5,0 5.67e-5,3.7795275e-5 5.67e-5,7.5590551e-5 V 7.999937 c 0,3.78e-5 -2.65e-5,7.56e-5 -5.67e-5,7.56e-5 H 5.6692913e-5 C 2.2677165e-5,8.0000126 0,7.9999748 0,7.999937 V 7.5590551e-5 C 0,3.7795276e-5 2.2677165e-5,0 5.6692913e-5,0 Z"
+         style="opacity:1;fill:#db1545;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:15.99999905;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="rect6445-2"
+         inkscape:connector-curvature="0" />
+    </pattern>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient7044"
+       id="linearGradient6476"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(3.223659,0,0,2.5556636,-579.27357,808.39)"
+       x1="86.490868"
+       y1="-216.62756"
+       x2="176.77992"
+       y2="-216.62756" />
+    <mask
+       maskUnits="userSpaceOnUse"
+       id="mask6472">
+      <rect
+         transform="rotate(-90)"
+         y="-0.91986513"
+         x="-300.45657"
+         height="511.36566"
+         width="291.06116"
+         id="rect6474"
+         style="opacity:1;fill:url(#linearGradient6476);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.92238116;stroke-miterlimit:4;stroke-dasharray:none" />
+    </mask>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#1e1d65"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.84705882"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.59714111"
+     inkscape:cx="708.91441"
+     inkscape:cy="407.20421"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1057"
+     inkscape:window-x="1912"
+     inkscape:window-y="1143"
+     inkscape:window-maximized="1"
+     objecttolerance="1"
+     guidetolerance="10000"
+     gridtolerance="10000"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     showguides="false">
+    <inkscape:grid
+       type="xygrid"
+       id="grid6443"
+       spacingx="2.1166667"
+       spacingy="2.1166667"
+       empspacing="4"
+       color="#3f3fff"
+       opacity="0.1254902"
+       enabled="false" />
+    <sodipodi:guide
+       position="-69.219003,3.872392"
+       orientation="1,0"
+       id="guide6508"
+       inkscape:locked="false" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <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>
+  <g
+     inkscape:label="レイヤー 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-11.249983)">
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.26499999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 149.59224,187.51883 -30.48108,6.4476 18.58548,61.14441 32.06774,-5.02079 2.27916,-39.16205 -20.18463,5.72179 z m -19.28212,12.50282 11.30447,-2.22985 0.81973,12.45223 -7.5888,1.65389 z m 15.28477,16.59486 0.74067,11.65353 -7.42226,2.02029 -3.70369,-10.82413 z m 1.61836,17.96698 1.20153,11.02325 -5.56723,1.37628 -3.18232,-10.49349 z m 14.34445,-2.69044 0.26461,11.20806 -5.86133,1.29523 -1.20102,-11.02336 z"
+       id="path5398"
+       inkscape:connector-curvature="0" />
+    <circle
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:1.99730551"
+       id="path5392"
+       cx="253.06117"
+       cy="887.61829"
+       r="642.68146" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 329.51477,199.15082 -32.04286,18.26817 12.8142,1.28619 -6.02656,28.18505 32.94792,3.49531 0.51681,-27.76301 11.91226,1.00737 z m -14.10711,25.93826 6.27123,0.90288 -1.15019,5.4805 -6.00929,-0.898 z m 13.58524,2.09643 0.42171,5.50053 -6.35262,-0.44337 1.22618,-5.67857 z m -15.04127,5.73678 6.21844,0.90138 -1.87301,4.94347 -5.07899,-0.81761 z m 8.80707,1.53673 6.3403,1.10313 0.43128,4.98637 -7.83808,-1.19409 z"
+       id="path6874"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccccccccccccccccccccccccccc" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 366.28967,254.78298 7.49431,-30.40441 -7.41388,-2.66046 1.18763,-3.36104 7.21205,2.27141 1.38362,-5.73044 -7.20912,-2.66047 1.28561,-3.65794 7.01313,2.7643 2.17341,-7.01022 3.35519,1.48161 -2.1734,6.51147 6.70747,2.66046 -1.28564,3.16213 -6.31255,-2.46154 -1.68638,6.02735 6.80837,2.46447 -0.9887,3.84808 -6.90052,-2.47031 -6.71038,30.41026 z"
+       id="path6891"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccccccccccccccccc" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.99999994px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 278.09961 779.17383 L 273.55469 781.65234 L 282.30273 807.51562 L 265.05078 812.48633 L 316.54688 967.83984 L 396.62305 947.04297 L 369.47266 782.39453 L 286.1543 806.4043 L 278.09961 779.17383 z M 341.34766 817.19922 L 346.93555 855.88672 L 315.41797 863.33008 L 300.96094 827.68945 L 341.34766 817.19922 z M 355.63477 872.21094 L 358.58984 909.34961 L 332.12891 916.2207 L 318.54883 881.09766 L 355.63477 872.21094 z "
+       transform="matrix(0.26458333,0,0,0.26458333,0,11.249983)"
+       id="path6944" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.24600939px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 43.603475,280.06036 -10.564819,-28.58824 -6.574764,2.28618 -0.916385,-3.37337 6.23111,-2.47535 -2.011396,-5.37101 -6.431418,2.16468 -1.002197,-3.66725 6.348194,-1.96596 -2.123972,-6.85578 3.11982,-0.81419 1.86458,6.45975 6.080155,-1.86705 0.744318,3.27357 -5.700174,1.79072 1.953823,5.78639 6.048884,-2.08256 1.308957,3.64208 -6.116434,2.13257 11.116753,28.12778 z"
+       id="path6891-8"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccccccccccccccccc" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 411.98753,264.70523 3.91734,-12.57157 -7.13355,-3.53259 -1.396,-8.02014 5.81668,-6.93436 10.92618,-0.52461 7.35863,5.88054 0.0806,8.11138 -5.67524,6.95564 -7.37536,-0.96565 -1.04168,4.03744 5.21293,-1.96321 1.42492,-6.58308 5.61592,-1.7579 5.33002,3.98422 -1.35343,5.14755 -3.67857,2.33882 -4.89966,-2.03926 -7.52592,2.91667 -1.60892,6.84465 z"
+       id="path6985"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccccccccccccccccc" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.27861062px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 438.77767,272.41521 -0.009,-2.99656 1.24656,2.44908 1.28337,-1.87551 -0.0534,2.25473 2.30831,-1.55949 -1.70125,2.67579 z"
+       id="path7212"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.29395995px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 387.1467,259.13862 -0.3913,-3.17093 1.60741,2.46066 1.09423,-2.12083 0.23196,2.39229 2.19942,-1.8946 -1.42637,3.01207 z"
+       id="path7212-4"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 457.96894,278.42384 1.02302,-2.77836 -1.31183,-0.56021 0.33336,-0.616 1.26318,0.48291 0.54568,-1.37607 0.81934,0.31324 -0.47741,1.4022 1.87364,0.67714 0.47795,-1.14765 0.83893,0.26207 -0.47245,1.28672 1.80283,0.70884 0.41215,-1.23149 0.92825,0.33529 -0.49337,1.23952 1.38917,0.51162 -0.21081,0.85845 -1.42731,-0.56527 -1.05878,2.6669 -0.81279,-0.33034 0.94975,-2.68892 -1.68742,-0.7038 -1.03512,2.65627 -0.83236,-0.27915 0.99293,-2.75061 -1.92628,-0.79522 -1.00194,2.82543 z"
+       id="path7229"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccccccccccccccccccccccccccccc" />
+    <path
+       id="path7233"
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 74.377161,266.1298 4.106469,-1.43113 -0.172672,-0.43324 -1.671435,0.71552 -0.01769,-0.52355 -0.695931,0.27732 0.269498,0.38302 -1.969845,0.57184 z m 0.413029,0.18076 3.507847,-1.12578 0.462403,3.63281 -2.391715,0.76757 z"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccccccccccccc" />
+    <path
+       style="fill:#172062;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;fill-opacity:1"
+       d="m 156.55184,206.61884 0.47605,-0.20403 1.0201,8.90891 -0.47605,0.20402 z"
+       id="path7236"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:#172062;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;fill-opacity:1"
+       d="m 160.97229,209.47512 0.20402,4.96451 0.47605,-0.068 0.068,-5.03251 z"
+       id="path7238"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:#172062;fill-opacity:1;stroke:none;stroke-width:0.34364724px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 23.838748,287.33572 -2.186787,-3.04882 3.027872,1.63785 -0.07842,-2.79635 1.585239,2.33549 1.177306,-3.18042 0.241718,3.90016 z"
+       id="path7212-4-6"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>