diff --git a/config/storybook/preview.js b/config/storybook/preview.js
index bea3f949..32ea951b 100644
--- a/config/storybook/preview.js
+++ b/config/storybook/preview.js
@@ -2,6 +2,8 @@ import { addParameters, addDecorator } from '@storybook/vue'
 import { withA11y } from '@storybook/addon-a11y'
 import { DocsPage } from '@storybook/addon-docs/blocks'
 
+import mainStore from '../../src/store'
+
 addParameters({
   options: {
     showRoots: true
@@ -22,5 +24,6 @@ addDecorator(withA11y)
 addDecorator(() => ({
   template: `<div class="s-flex" style="padding: 20px;">
                <story/>
-             </div>`
+             </div>`,
+  store: mainStore
 }))
diff --git a/package.json b/package.json
index 078b48fe..bac110c4 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "0.6.4",
+  "version": "0.6.7",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"
@@ -25,7 +25,9 @@
     "v-jsoneditor": "^1.4.1",
     "vue": "^2.6.11",
     "vue-class-component": "^7.2.3",
-    "vue-property-decorator": "^8.4.1"
+    "vue-property-decorator": "^8.4.1",
+    "vuex": "^3.1.3",
+    "vuex-class": "^0.3.2"
   },
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^6.0.0",
diff --git a/src/components/Icon/SIcon.vue b/src/components/Icon/SIcon.vue
index da82e129..89244937 100644
--- a/src/components/Icon/SIcon.vue
+++ b/src/components/Icon/SIcon.vue
@@ -42,7 +42,7 @@ export default class SIcon extends Vue {
   get computedStyles () {
     const styles = {} as any
     if (this.size) {
-      styles.fontSize = typeof this.size === 'number' ? `${this.size}px` : this.size
+      styles.fontSize = !isNaN(+this.size) ? `${this.size}px` : this.size
     }
     return styles
   }
diff --git a/src/components/Tooltip/STooltip.vue b/src/components/Tooltip/STooltip.vue
index 48807ffc..a40eab8b 100644
--- a/src/components/Tooltip/STooltip.vue
+++ b/src/components/Tooltip/STooltip.vue
@@ -1,7 +1,7 @@
 <template>
   <el-tooltip
     ref="tooltip"
-    :effect="theme"
+    :effect="computedTheme"
     :content="content"
     :placement="placement"
     v-model="model"
@@ -23,21 +23,24 @@
 
 <script lang="ts">
 import { Component, Mixins, Prop, Watch, Ref } from 'vue-property-decorator'
+import { Getter } from 'vuex-class'
 import { TooltipEffect } from 'element-ui/types/tooltip'
 import { PopoverPlacement } from 'element-ui/types/popover'
 import debounce from 'throttle-debounce/debounce'
 
 import BorderRadiusMixin from '../../mixins/BorderRadiusMixin'
+import { Theme } from '../../utils/Theme'
 import { TooltipTheme, TooltipPlacement } from './consts'
 
 @Component
 export default class STooltip extends Mixins(BorderRadiusMixin) {
   /**
-   * Theme of the tooltip. Supported values: `"dark"` or `"light"`.
+   * Theme of the tooltip. Supported values: `"dark"`, `"light"`, or `"auto"`.
+   * `"auto"` means that it will be managed with theming controller by `setTheme` function
    *
-   * `"dark"` by default
+   * `"auto"` is set by default
    */
-  @Prop({ default: TooltipTheme.DARK, type: String }) readonly theme!: TooltipEffect
+  @Prop({ default: TooltipTheme.AUTO, type: String }) readonly theme!: string
   /**
    * Content of the tooltip. You can set content from `content` slot as well
    */
@@ -108,6 +111,8 @@ export default class STooltip extends Mixins(BorderRadiusMixin) {
 
   @Ref('tooltip') tooltip!: any
 
+  @Getter libraryTheme!: Theme
+
   get computedPopperClass (): string {
     const cssClasses: Array<string> = []
     if (this.popperClass) {
@@ -138,5 +143,16 @@ export default class STooltip extends Mixins(BorderRadiusMixin) {
     }
     tooltip.debounceClose = debounce(30, tooltip.handleClosePopper)
   }
+
+  get computedTheme (): string {
+    if (this.theme === TooltipTheme.AUTO) {
+      if (this.libraryTheme) {
+        return this.libraryTheme
+      } else {
+        throw new Error('Please provide a storage for the ui-library')
+      }
+    }
+    return this.theme
+  }
 }
 </script>
diff --git a/src/components/Tooltip/consts.ts b/src/components/Tooltip/consts.ts
index 436ddd8e..1a6d613b 100644
--- a/src/components/Tooltip/consts.ts
+++ b/src/components/Tooltip/consts.ts
@@ -1,6 +1,7 @@
 export enum TooltipTheme {
   DARK = 'dark',
-  LIGHT = 'light'
+  LIGHT = 'light',
+  AUTO = 'auto'
 }
 
 export enum TooltipPlacement {
diff --git a/src/index.ts b/src/index.ts
index 68a17fe3..86d79d9d 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -50,6 +50,8 @@ import {
 import { Float, Integer } from './directives'
 import { Components } from './types/components'
 import { Directives } from './types/directives'
+import { modules, Modules } from './store'
+import { setTheme } from './utils'
 import { Loading, Message, MessageBox, Notification } from './plugins/elementUI'
 
 const components = [
@@ -106,7 +108,13 @@ const directives = [
 ]
 
 const SoramitsuElements = {
-  install (vue: typeof Vue): void {
+  install (vue: typeof Vue, options?: any): void {
+    // TODO: maybe we'll need error message about storage here
+    if (options && options.store) {
+      Object.values(Modules).forEach(molude => {
+        options.store.registerModule(molude, modules[molude])
+      })
+    }
     components.forEach(el => vue.component(el.name, el.component))
     directives.forEach(item => vue.directive(item.name, item.directive))
   }
@@ -117,6 +125,7 @@ if (typeof window !== 'undefined' && window.Vue) {
 }
 
 export {
+  setTheme,
   Loading,
   Message,
   MessageBox,
diff --git a/src/store/Theme.ts b/src/store/Theme.ts
new file mode 100644
index 00000000..0e0ccf66
--- /dev/null
+++ b/src/store/Theme.ts
@@ -0,0 +1,50 @@
+import map from 'lodash/fp/map'
+import flatMap from 'lodash/fp/flatMap'
+import fromPairs from 'lodash/fp/fromPairs'
+import flow from 'lodash/fp/flow'
+import concat from 'lodash/fp/concat'
+
+import { Theme, Themes } from '../utils/Theme'
+
+const types = flow(
+  flatMap(x => [x + '_REQUEST', x + '_SUCCESS', x + '_FAILURE']),
+  concat([
+    'CHANGE_THEME'
+  ]),
+  map(x => [x, x]),
+  fromPairs
+)([])
+
+function initialState () {
+  return {
+    theme: Themes.LIGHT
+  }
+}
+
+const state = initialState()
+
+const getters = {
+  libraryTheme (state) {
+    return state.theme
+  }
+}
+
+const mutations = {
+  [types.CHANGE_THEME] (state, theme: Theme) {
+    state.theme = theme
+  }
+}
+
+const actions = {
+  changeTheme ({ commit }, { theme }) {
+    commit(types.CHANGE_THEME, theme)
+  }
+}
+
+export default {
+  types,
+  state,
+  getters,
+  mutations,
+  actions
+}
diff --git a/src/store/index.ts b/src/store/index.ts
new file mode 100644
index 00000000..c8d35ae7
--- /dev/null
+++ b/src/store/index.ts
@@ -0,0 +1,25 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+import Theme from './Theme'
+
+const modules = {
+  Theme
+}
+
+Vue.use(Vuex)
+
+const store = new Vuex.Store({
+  modules,
+  strict: process.env.NODE_ENV !== 'production'
+})
+
+export {
+  modules
+}
+
+export enum Modules {
+  Theme = 'Theme'
+}
+
+export default store
diff --git a/src/stories/Dropdown/SDropdown.stories.ts b/src/stories/Dropdown/SDropdown.stories.ts
index b01e3d03..b1bb21c6 100644
--- a/src/stories/Dropdown/SDropdown.stories.ts
+++ b/src/stories/Dropdown/SDropdown.stories.ts
@@ -17,7 +17,7 @@ export const configurable = () => ({
   template: `<s-dropdown
                type="button"
                :size="size"
-               :borderRadius="borderRadius"
+               :border-radius="borderRadius"
                :buttonType="buttonType"
                :placement="placement"
                :hide-on-click="hideOnClick"
diff --git a/src/stories/Intro/Customization.stories.ts b/src/stories/Intro/Customization.stories.ts
index f74e9ce0..a5451ddb 100644
--- a/src/stories/Intro/Customization.stories.ts
+++ b/src/stories/Intro/Customization.stories.ts
@@ -83,7 +83,7 @@ export const configurable = () => ({
                   <s-input
                     type="number"
                     :placeholder="button.label + ' (px)'"
-                    :borderRadius="button.label"
+                    :border-radius="button.label"
                     style="margin-right: 10px; margin-right: 10px;"
                     @change="(value) => handleBorderRadiusChange(button.label, value)"
                   />
diff --git a/src/stories/Menu/SMenu.stories.ts b/src/stories/Menu/SMenu.stories.ts
index 246c197b..01e7ab66 100644
--- a/src/stories/Menu/SMenu.stories.ts
+++ b/src/stories/Menu/SMenu.stories.ts
@@ -13,7 +13,7 @@ export const basicMenu = () => ({
   template: `<s-aside width="220px">
                <s-menu
                  default-active="1"
-                 :borderRadius="borderRadius"
+                 :border-radius="borderRadius"
                  @open="handleOpen"
                  @select="handleSelect"
                  @close="handleClose">
@@ -62,7 +62,7 @@ export const sideBar = () => ({
   template: `<s-aside width="220px">
                <s-menu
                  default-active="2"
-                 :borderRadius="borderRadius"
+                 :border-radius="borderRadius"
                  @open="handleOpen"
                  @select="handleSelect"
                  @close="handleClose">
@@ -121,7 +121,7 @@ export const topBar = () => ({
   template: `<s-menu
                default-active="4"
                mode="horizontal"
-               :borderRadius="borderRadius"
+               :border-radius="borderRadius"
                @select="handleSelect">
                <s-menu-item index="1">Navigator One</s-menu-item>
                <s-submenu index="2">
diff --git a/src/stories/SButton.stories.ts b/src/stories/SButton.stories.ts
index 83cee41b..a0d61544 100644
--- a/src/stories/SButton.stories.ts
+++ b/src/stories/SButton.stories.ts
@@ -20,7 +20,7 @@ export const configurable = () => ({
                :icon="type === 'action' ? 'back' : ''"
                :type="type"
                :size="size"
-               :borderRadius="borderRadius"
+               :border-radius="borderRadius"
                :rounded="rounded"
                :alternative="alternative"
                @click="handleClick"
@@ -117,7 +117,7 @@ export const withDifferentBorderRadius = () => ({
                <s-button
                  v-for="item in items"
                  :key="item.borderRadius"
-                 :borderRadius="item.borderRadius"
+                 :border-radius="item.borderRadius"
                >
                  {{ item.label }}
                </s-button>
diff --git a/src/stories/SCard.stories.ts b/src/stories/SCard.stories.ts
index 1150b755..b98d05e8 100644
--- a/src/stories/SCard.stories.ts
+++ b/src/stories/SCard.stories.ts
@@ -13,11 +13,11 @@ export default {
 export const configurable = () => ({
   components: { SCard, SRow, SDropdown, SDropdownItem },
   template: `<s-row class="s-flex" style="flex: 1; justify-content: space-between; align-items: center;">
-               <s-card style="width: 80%;" :shadow="shadow" :borderRadius="borderRadius" :clickable="clickable" @click="handleClick">
+               <s-card style="width: 80%;" :shadow="shadow" :border-radius="borderRadius" :clickable="clickable" @click="handleClick">
                  <template slot="header">
                    <div class="s-flex" style="justify-content: space-between; padding-right: 20px;">
                      <span>{{ header }}</span>
-                     <s-dropdown type="ellipsis" :borderRadius="borderRadius">
+                     <s-dropdown type="ellipsis" :border-radius="borderRadius">
                        Menu
                        <template #menu>
                          <s-dropdown-item>First</s-dropdown-item>
diff --git a/src/stories/SCheckbox.stories.ts b/src/stories/SCheckbox.stories.ts
index b97569ce..41289340 100644
--- a/src/stories/SCheckbox.stories.ts
+++ b/src/stories/SCheckbox.stories.ts
@@ -17,7 +17,7 @@ export const configurable = () => ({
                  v-model="vModelValue"
                  :disabled="disabled"
                  :border="border"
-                 :borderRadius="borderRadius"
+                 :border-radius="borderRadius"
                  :size="size"
                  :label="label"
                  @change="(value) => changeValue = value"
@@ -100,12 +100,12 @@ export const differentBorderRadius = () => ({
   template: `<s-row :gutter="20" style="flex: 1;">
                <template v-for="item in items">
                  <s-col :span="6" style="height: 56px; margin-bottom: 20px;">
-                   <s-checkbox :borderRadius="item.borderRadius" :value="false">
+                   <s-checkbox :border-radius="item.borderRadius" :value="false">
                      {{ item.label }}
                    </s-checkbox>
                  </s-col>
                  <s-col :span="6" style="height: 56px; margin-bottom: 20px;">
-                   <s-checkbox border :borderRadius="item.borderRadius" :value="true">
+                   <s-checkbox border :border-radius="item.borderRadius" :value="true">
                      {{ item.label }}
                    </s-checkbox>
                  </s-col>
diff --git a/src/stories/SDatePicker.stories.ts b/src/stories/SDatePicker.stories.ts
index 5afd3413..59fb117a 100644
--- a/src/stories/SDatePicker.stories.ts
+++ b/src/stories/SDatePicker.stories.ts
@@ -22,8 +22,8 @@ export const configurable = () => ({
                  :disabled="disabled"
                  :clearable="clearable"
                  :align="align"
-                 :borderRadius="borderRadius"
-                 :popperClass="borderRadius"
+                 :border-radius="borderRadius"
+                 :popper-class="borderRadius"
                  :input-type="inputType"
                  placeholder="Select date"
                  start-placeholder="From"
diff --git a/src/stories/SDialog.stories.ts b/src/stories/SDialog.stories.ts
index a56e4518..2f5456dd 100644
--- a/src/stories/SDialog.stories.ts
+++ b/src/stories/SDialog.stories.ts
@@ -23,7 +23,7 @@ export const configurable = () => ({
                  :width="width"
                  :fullscreen="fullscreen"
                  :top="top"
-                 :borderRadius="borderRadius"
+                 :border-radius="borderRadius"
                  :show-close="showClose"
                  :close-on-click-modal="closeOnClickModal"
                  :close-on-esc="closeOnEsc"
diff --git a/src/stories/SInput.stories.ts b/src/stories/SInput.stories.ts
index 85381d27..8e394b96 100644
--- a/src/stories/SInput.stories.ts
+++ b/src/stories/SInput.stories.ts
@@ -18,7 +18,7 @@ export const configurable = () => ({
                :type="type"
                :placeholder="placeholder"
                :disabled="disabled"
-               :borderRadius="borderRadius"
+               :border-radius="borderRadius"
                :show-password="showPassword"
                :readonly="readonly"
                :show-text-limit="showTextLimit"
diff --git a/src/stories/SPagination.stories.ts b/src/stories/SPagination.stories.ts
index d18d3012..39628d4d 100644
--- a/src/stories/SPagination.stories.ts
+++ b/src/stories/SPagination.stories.ts
@@ -18,8 +18,8 @@ export const configurable = () => ({
                  :disabled="disabled"
                  :small="small"
                  :background="background"
-                 :borderRadius="borderRadius"
-                 :popperClass="borderRadius"
+                 :border-radius="borderRadius"
+                 :popper-class="borderRadius"
                  :prev-text="prevText"
                  :next-text="nextText"
                  @size-change="handleSizeChange"
diff --git a/src/stories/STooltip.stories.ts b/src/stories/STooltip.stories.ts
index 9d9a0eba..fcd35aa9 100644
--- a/src/stories/STooltip.stories.ts
+++ b/src/stories/STooltip.stories.ts
@@ -19,7 +19,7 @@ export const configurable = () => ({
                  v-model="model"
                  :content="content"
                  :disabled="disabled"
-                 :borderRadius="borderRadius"
+                 :border-radius="borderRadius"
                  :offset="offset"
                  :openDelay="openDelay"
                  @change="handleChange"
@@ -32,7 +32,7 @@ export const configurable = () => ({
   }),
   props: {
     theme: {
-      default: select('Theme', Object.values(TooltipTheme), TooltipTheme.DARK)
+      default: select('Theme', Object.values(TooltipTheme), TooltipTheme.AUTO)
     },
     content: {
       default: text('Content', 'Custom tooltip')
diff --git a/src/stories/Select/SSelect.stories.ts b/src/stories/Select/SSelect.stories.ts
index 85215c81..b901094f 100644
--- a/src/stories/Select/SSelect.stories.ts
+++ b/src/stories/Select/SSelect.stories.ts
@@ -26,7 +26,7 @@ export const configurable = () => ({
                  <s-select
                    v-model="model"
                    :disabled="disabled"
-                   :borderRadius="borderRadius"
+                   :border-radius="borderRadius"
                    :loading="loading"
                    :multiple="multiple"
                    :input-type="item.inputType"
@@ -36,7 +36,7 @@ export const configurable = () => ({
                    :multiple-text-prefix="multipleTextPrefix"
                    :loading-text="loadingText"
                    :no-data-text="noDataText"
-                   :popperClass="borderRadius"
+                   :popper-class="borderRadius"
                    @change="handleChange"
                  >
                    <s-option
diff --git a/src/stories/Tab/STabs.stories.ts b/src/stories/Tab/STabs.stories.ts
index ec8886d6..6d066df9 100644
--- a/src/stories/Tab/STabs.stories.ts
+++ b/src/stories/Tab/STabs.stories.ts
@@ -15,7 +15,7 @@ export const defaultUsage = () => ({
   template: `<s-tabs
                v-model="activeName"
                :type="type"
-               :borderRadius="borderRadius"
+               :border-radius="borderRadius"
                :position="position"
                :closable="closable"
                :addable="addable"
diff --git a/src/styles/menu.scss b/src/styles/menu.scss
index 5a790d35..7054369f 100644
--- a/src/styles/menu.scss
+++ b/src/styles/menu.scss
@@ -29,12 +29,17 @@ $margin-bottom-menu-item: 8px;
     margin-right: $margin-bottom-menu-item;
   }
 }
+.el-menu--horizontal > .el-menu-item {
+  &,
+  &.is-active {
+    border-bottom: none;
+  }
+}
 .el-menu-item {
   align-items: center;
   &:not(.is-disabled):hover,
   &.is-active {
     background-color: var(--s-menu-color-hover) !important;
-    border-bottom-color: var(--s-menu-color-hover) !important;
     i {
       color: var(--s-menu-text-color-active);
     }
diff --git a/src/styles/tabs.scss b/src/styles/tabs.scss
index e6fa2d3c..641d5009 100644
--- a/src/styles/tabs.scss
+++ b/src/styles/tabs.scss
@@ -91,6 +91,7 @@
     .el-tabs__nav-wrap {
       background-color: var(--s-color-base-background);
       height: 32px;
+      padding: 2px;
       &::after,
       .el-tabs__active-bar {
         height: 0;
@@ -107,7 +108,6 @@
           color: var(--s-color-base-content-primary);
           background-color: var(--s-color-base-on-accent);
           box-shadow: $s-shadow-surface;
-          margin: 2px;
         }
         &:focus.is-focus {
           // TODO: make it more focusable
diff --git a/src/utils/Theme.ts b/src/utils/Theme.ts
new file mode 100644
index 00000000..eb46108b
--- /dev/null
+++ b/src/utils/Theme.ts
@@ -0,0 +1,6 @@
+export type Theme = 'dark' | 'light'
+
+export enum Themes {
+  DARK = 'dark',
+  LIGHT = 'light'
+}
diff --git a/src/utils/index.ts b/src/utils/index.ts
new file mode 100644
index 00000000..f1551c93
--- /dev/null
+++ b/src/utils/index.ts
@@ -0,0 +1,6 @@
+import store from '../store'
+import { Theme } from './Theme'
+
+export const setTheme = (theme: Theme) => {
+  store.dispatch('changeTheme', { theme })
+}
diff --git a/yarn.lock b/yarn.lock
index a67f47b8..aeae21c0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -15676,6 +15676,16 @@ vue@^2.6.11:
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
   integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==
 
+vuex-class@^0.3.2:
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/vuex-class/-/vuex-class-0.3.2.tgz#c7e96a076c1682137d4d23a8dcfdc63f220e17a8"
+  integrity sha512-m0w7/FMsNcwJgunJeM+wcNaHzK2KX1K1rw2WUQf7Q16ndXHo7pflRyOV/E8795JO/7fstyjH3EgqBI4h4n4qXQ==
+
+vuex@^3.1.3:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.6.0.tgz#95efa56a58f7607c135b053350833a09e01aa813"
+  integrity sha512-W74OO2vCJPs9/YjNjW8lLbj+jzT24waTo2KShI8jLvJW8OaIkgb3wuAMA7D+ZiUxDOx3ubwSZTaJBip9G8a3aQ==
+
 w3c-hr-time@^1.0.1, w3c-hr-time@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd"