diff --git a/packages/theme/styles/_colors.scss b/packages/theme/styles/_colors.scss
index 1e00a0b6c7..a02872d16a 100644
--- a/packages/theme/styles/_colors.scss
+++ b/packages/theme/styles/_colors.scss
@@ -15,6 +15,7 @@
 
 /* Common Colors */
 * {
+  --primary-button-color: #fff;
   --primary-button-enabled: #4474F6;
   --primary-button-hovered: #2A5FF6;
   --primary-button-pressed: #194CD7;
diff --git a/packages/ui/src/components/Button.svelte b/packages/ui/src/components/Button.svelte
index d9e988b7eb..b1f507fc4f 100644
--- a/packages/ui/src/components/Button.svelte
+++ b/packages/ui/src/components/Button.svelte
@@ -65,6 +65,7 @@
   }
 
   .primary {
+    color: var(--primary-button-color);
     background-color: var(--primary-button-enabled);
     border-color: var(--primary-button-border);
 
diff --git a/plugins/recruit-resources/src/components/DialogHeader.svelte b/plugins/recruit-resources/src/components/DialogHeader.svelte
index 6d55e3ce34..9b5ddcf388 100644
--- a/plugins/recruit-resources/src/components/DialogHeader.svelte
+++ b/plugins/recruit-resources/src/components/DialogHeader.svelte
@@ -18,7 +18,10 @@
   import { getMetadata } from '@anticrm/platform'
   import login from '@anticrm/login'
 
-  import Label from '@anticrm/ui/src/components/Label.svelte'
+  import { Label } from '@anticrm/ui'
+  import ImageButton from './ImageButton.svelte'
+  import File from './icons/File.svelte'
+  import FileUpload from './icons/FileUpload.svelte'
 
   let dragover = false
 
@@ -53,16 +56,21 @@
     <div class="title">Candidate title</div>
     <!-- <input type="file" name="file" id="file"/> -->
   </div>
+  <div class="resume-btn">
+    <ImageButton label={'Upload resume'} icon={FileUpload} />
+  </div>
 </div>
 
 <style lang="scss">
 
   .header {
+    position: relative;
     display: flex;
     justify-content: center;
     align-items: center;
     width: 40rem;
     min-height: 15rem;
+    height: 15rem;
     background-image: url(../../img/header-green.png);
     background-repeat: no-repeat;
     background-clip: border-box;
@@ -84,12 +92,18 @@
       font-size: 1rem;
       font-weight: 500;
       line-height: 150%;
-      color: var(--theme-caption-color);
+      color: #fff;
     }
     .title {
       font-size: .75rem;
       font-weight: 500;
-      color: var(--theme-content-color);
+      color: rgba(255, 255, 255, .8);
+    }
+
+    .resume-btn {
+      position: absolute;
+      left: 1rem;
+      bottom: 1rem;
     }
   }
 
diff --git a/plugins/recruit-resources/src/components/ImageButton.svelte b/plugins/recruit-resources/src/components/ImageButton.svelte
new file mode 100644
index 0000000000..a802af21cf
--- /dev/null
+++ b/plugins/recruit-resources/src/components/ImageButton.svelte
@@ -0,0 +1,67 @@
+<!--
+// Copyright © 2020, 2021 Anticrm Platform Contributors.
+// Copyright © 2021 Hardcore Engineering Inc.
+// 
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+// 
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// 
+// See the License for the specific language governing permissions and
+// limitations under the License.
+-->
+
+<script lang="ts">
+  import type { IntlString, Asset } from '@anticrm/platform'
+  import type { AnySvelteComponent } from '@anticrm/ui'
+  import { Label, Icon } from '@anticrm/ui'
+
+  export let label: IntlString
+  export let icon: Asset | AnySvelteComponent
+</script>
+
+<div class="flex-row-center container">
+  <div class="icon">
+    {#if typeof (icon) === 'string'}
+      <Icon {icon} size='small'/>
+    {:else}
+      <svelte:component this={icon} size='small' />
+    {/if}
+  </div>
+  <span><Label {label} /></span>
+</div>
+
+<style lang="scss">
+  .container {
+    padding: .5rem .75rem;
+    color: #fff;
+    background-color: rgba(255, 255, 255, .17);
+    border: 1px solid rgba(255, 255, 255, .14);
+    border-radius: .5rem;
+    backdrop-filter: blur(3px);
+    cursor: pointer;
+
+    .icon {
+      transform-origin: center center;
+      transform: scale(.75);
+    }
+
+    span {
+      margin-left: 0.376rem;
+      font-weight: 500;
+      user-select: none;
+    }
+
+    &:hover {
+      background-color: rgba(255, 255, 255, .22);
+      border-color: rgba(255, 255, 255, .19);
+      box-shadow: 0 0 1rem rgba(0, 0, 0, .3);
+    }
+    &:active {
+      box-shadow: 0 0 1rem rgba(0, 0, 0, .1);
+    }
+  }
+</style>
diff --git a/plugins/recruit-resources/src/components/icons/Address.svelte b/plugins/recruit-resources/src/components/icons/Address.svelte
index 136db5bc75..3b590099f8 100644
--- a/plugins/recruit-resources/src/components/icons/Address.svelte
+++ b/plugins/recruit-resources/src/components/icons/Address.svelte
@@ -19,6 +19,6 @@
   const fill: string = 'var(--theme-caption-color)'
 </script>
 
-<svg class="svg-{size}" {fill} viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
-  <path d="M16.1,8.2c-0.3-0.6-0.8-1-1.6-1.8l-0.8-0.7c-1.6-1.4-2.5-2.1-3.6-2.1c-1.1,0-1.9,0.7-3.6,2.1L5.6,6.5 C4.7,7.2,4.2,7.6,3.9,8.2c-0.3,0.6-0.3,1.2-0.3,2.4v3.5c0,1.7,0,2.6,0.6,3.2C4.9,18,5.8,18,7.5,18h0.4c0,0,0,0,0,0s0,0,0,0h4.2 c0,0,0,0,0,0s0,0,0,0h0.4c1.7,0,2.6,0,3.2-0.6c0.6-0.6,0.6-1.5,0.6-3.2v-3.5C16.3,9.5,16.3,8.8,16.1,8.2z M11.6,17H8.4v-3.5 c0-0.3,0.2-0.5,0.5-0.5h2.2c0.3,0,0.5,0.2,0.5,0.5V17z M15.3,14.2c0,1.5,0,2.2-0.3,2.5C14.7,17,14,17,12.6,17v-3.5 c0-0.8-0.7-1.5-1.5-1.5H8.9c-0.8,0-1.5,0.7-1.5,1.5V17C6,17,5.3,17,5,16.7c-0.3-0.3-0.3-1-0.3-2.5v-3.5c0-1.1,0-1.6,0.2-2 s0.6-0.7,1.4-1.4l0.8-0.7C8.5,5.3,9.3,4.6,10,4.6s1.5,0.6,2.9,1.9l0.8,0.7c0.8,0.7,1.2,1,1.4,1.4s0.2,0.9,0.2,2V14.2z"/>
+<svg class="svg-{size}" {fill} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14.8,5.1c-0.3-0.7-0.9-1.1-1.8-2l-0.9-0.8C10.4,0.8,9.4,0,8.2,0s-2.1,0.8-4,2.3l-1,0.9C2.2,4,1.6,4.4,1.3,5.1 S0.9,6.4,0.9,7.8v3.9c0,1.9,0,2.9,0.7,3.6C2.4,16,3.4,16,5.3,16h0.4l0,0l0,0h4.7l0,0l0,0h0.4c1.9,0,2.9,0,3.6-0.7s0.7-1.7,0.7-3.6 V7.9C15.1,6.6,15.1,5.8,14.8,5.1z M9.8,14.9H6.3V11c0-0.3,0.2-0.6,0.6-0.6h2.4c0.3,0,0.6,0.2,0.6,0.6C9.8,11,9.8,14.9,9.8,14.9z M13.9,11.8c0,1.7,0,2.4-0.3,2.8c-0.3,0.3-1.1,0.3-2.7,0.3V11c0-0.9-0.8-1.7-1.7-1.7H6.8c-0.9,0-1.7,0.8-1.7,1.7v3.9 c-1.6,0-2.3,0-2.7-0.3c-0.3-0.3-0.3-1.1-0.3-2.8V7.9c0-1.2,0-1.8,0.2-2.2c0.2-0.4,0.7-0.8,1.6-1.6l0.9-0.8c1.6-1.4,2.4-2.2,3.2-2.2 c0.8,0,1.7,0.7,3.2,2.1L12.2,4c0.9,0.8,1.3,1.1,1.6,1.6c0.2,0.4,0.2,1,0.2,2.2C13.9,7.8,13.9,11.8,13.9,11.8z"/>
 </svg>
diff --git a/plugins/recruit-resources/src/components/icons/File.svelte b/plugins/recruit-resources/src/components/icons/File.svelte
index d3584f6040..d5e45d7cf2 100644
--- a/plugins/recruit-resources/src/components/icons/File.svelte
+++ b/plugins/recruit-resources/src/components/icons/File.svelte
@@ -19,6 +19,6 @@
   const fill: string = 'var(--theme-caption-color)'
 </script>
 
-<svg class="svg-{size}" {fill} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
-  <path d="M15.7,2.6C15.1,2,14.2,2,12.5,2H9.9C9.5,2,9.2,2,9,2.1S8.6,2.4,8.3,2.6l-4,4C4,6.9,3.9,7.1,3.8,7.3C3.7,7.6,3.7,7.8,3.7,8.2 v6c0,1.7,0,2.6,0.6,3.2S5.8,18,7.5,18h5c1.7,0,2.6,0,3.2-0.6s0.6-1.5,0.6-3.2V5.8C16.3,4.2,16.3,3.3,15.7,2.6z M5,7.4l4-4 C9.2,3.2,9.3,3.1,9.4,3c0,0,0.1,0,0.1,0v3.4c0,0.7,0,1.2-0.1,1.3C9.2,7.8,8.8,7.8,8.1,7.8H4.7c0,0,0-0.1,0-0.1 C4.7,7.7,4.8,7.5,5,7.4z M15.3,14.2c0,1.5,0,2.2-0.3,2.5S14,17,12.5,17h-5C6,17,5.3,17,5,16.7s-0.3-1-0.3-2.5V8.8h3.4 c1,0,1.6,0,2-0.4c0.4-0.4,0.4-1,0.4-2V3h2C14,3,14.7,3,15,3.3s0.3,1,0.3,2.5V14.2z"/>
+<svg class="svg-{size}" {fill} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+  <path d="M11.2,0C11.2,0,11.2,0,11.2,0H6C6,0,6,0,6,0s0,0-0.1,0H5.8C5.7,0,5.5,0.1,5.4,0.2L1.3,4.5C1.2,4.6,1.2,4.7,1.2,4.8v7.5 c0,2,1.5,3.6,3.5,3.7h6.5c0,0,0.1,0,0.1,0c2,0,3.6-1.7,3.5-3.7V3.5C14.8,1.6,13.2,0,11.2,0z M5.5,1.4v1.6c0,1-0.7,1.8-1.6,1.8H2.2 L5.5,1.4z M13.9,12.4c0,1.5-1.1,2.7-2.7,2.7H4.7c-1.5-0.1-2.6-1.2-2.6-2.7V5.8h1.8c1.4,0,2.6-1.2,2.6-2.8V1h4.8c0,0,0,0,0,0 c1.4,0,2.6,1.2,2.7,2.6V12.4z"/>
 </svg>
diff --git a/plugins/recruit-resources/src/components/icons/FileUpload.svelte b/plugins/recruit-resources/src/components/icons/FileUpload.svelte
new file mode 100644
index 0000000000..a8fa6c4b1b
--- /dev/null
+++ b/plugins/recruit-resources/src/components/icons/FileUpload.svelte
@@ -0,0 +1,25 @@
+<!--
+// Copyright © 2020, 2021 Anticrm Platform Contributors.
+// Copyright © 2021 Hardcore Engineering Inc.
+// 
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+// 
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// 
+// See the License for the specific language governing permissions and
+// limitations under the License.
+-->
+
+<script lang="ts">
+  export let size: 'small' | 'medium' | 'large'
+  const fill: string = 'var(--theme-caption-color)'
+</script>
+
+<svg class="svg-{size}" {fill} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+  <path d="M11.2,0C11.2,0,11.2,0,11.2,0H6C6,0,6,0,6,0s0,0-0.1,0H5.8C5.7,0,5.5,0.1,5.4,0.2L1.3,4.5C1.2,4.6,1.2,4.7,1.2,4.8v7.5 c0,2,1.5,3.6,3.5,3.7h6.5c0,0,0.1,0,0.1,0c2,0,3.6-1.7,3.5-3.7V3.5C14.8,1.6,13.2,0,11.2,0z M5.5,1.4v1.6c0,1-0.7,1.8-1.6,1.8H2.2 L5.5,1.4z M13.9,12.4c0,1.5-1.1,2.7-2.7,2.7H4.7c-1.5-0.1-2.6-1.2-2.6-2.7V5.8h1.8c1.4,0,2.6-1.2,2.6-2.8V1h4.8c0,0,0,0,0,0 c1.4,0,2.6,1.2,2.7,2.6V12.4z"/>
+  <path d="M8.3,5.8L8.3,5.8c0,0-0.1-0.1-0.2-0.1c0,0,0,0,0,0c-0.1,0-0.1,0-0.2,0c0,0-0.1,0-0.1,0c0,0,0,0,0,0c-0.1,0-0.1,0.1-0.2,0.1 c0,0,0,0,0,0L5.6,7.9c-0.2,0.2-0.2,0.5,0,0.7c0.2,0.2,0.5,0.2,0.7,0l1.3-1.3v4.2C7.5,11.8,7.7,12,8,12c0.3,0,0.5-0.2,0.5-0.5V7.3 l1.3,1.3c0.1,0.1,0.2,0.1,0.3,0.1s0.2,0,0.3-0.1c0.2-0.2,0.2-0.5,0-0.7L8.3,5.8z"/>
+</svg>