diff --git a/package.json b/package.json
index 862b828d..9423d215 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "0.7.14",
+  "version": "0.8.0",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"
diff --git a/src/assets/fonts/soramitsu-icons-1.0.0.ttf b/src/assets/fonts/soramitsu-icons-1.0.0.ttf
new file mode 100644
index 00000000..89af36c3
Binary files /dev/null and b/src/assets/fonts/soramitsu-icons-1.0.0.ttf differ
diff --git a/src/assets/fonts/soramitsu-icons-1.0.0.woff b/src/assets/fonts/soramitsu-icons-1.0.0.woff
deleted file mode 100644
index 3e6e32c7..00000000
Binary files a/src/assets/fonts/soramitsu-icons-1.0.0.woff and /dev/null differ
diff --git a/src/components/DatePicker/SDatePicker.vue b/src/components/DatePicker/SDatePicker.vue
index b000da54..724c2968 100644
--- a/src/components/DatePicker/SDatePicker.vue
+++ b/src/components/DatePicker/SDatePicker.vue
@@ -31,7 +31,7 @@
     >
       <slot name="range-separator" slot="range-separator"></slot>
     </el-date-picker>
-    <i v-if="!isInputType" class="s-icon-chevron-bottom"></i>
+    <s-icon v-if="!isInputType" name="chevron-down-rounded-16" />
   </div>
 </template>
 
@@ -42,11 +42,14 @@ import { ElFormItem } from 'element-ui/types/form-item'
 
 // TODO: ask do we need size prop for the component?
 // Prev comment => TODO: ask design team
+import { SIcon } from '../Icon'
 import SizeMixin from '../../mixins/SizeMixin'
 import BorderRadiusMixin from '../../mixins/BorderRadiusMixin'
 import { PickerTypes, PickerAlignment, InputTypes } from './consts'
 
-@Component
+@Component({
+  components: { SIcon }
+})
 export default class SDatePicker extends Mixins(SizeMixin, BorderRadiusMixin) {
   /**
    * Value of date picker component. Can be used with `v-model`.
diff --git a/src/components/Dropdown/SDropdown.vue b/src/components/Dropdown/SDropdown.vue
index 15ce5173..942e0c65 100644
--- a/src/components/Dropdown/SDropdown.vue
+++ b/src/components/Dropdown/SDropdown.vue
@@ -49,7 +49,7 @@ import { ElDropdown } from 'element-ui/types/dropdown'
 import SizeMixin from '../../mixins/SizeMixin'
 import BorderRadiusMixin from '../../mixins/BorderRadiusMixin'
 import { ButtonTypes, SButton } from '../Button'
-import { Icons, SIcon } from '../Icon'
+import { Icons24, SIcon } from '../Icon'
 import { STooltip } from '../Tooltip'
 import { DropdownType, DropdownPlacement, DropdownTrigger } from './consts'
 
@@ -73,7 +73,7 @@ export default class SDropdown extends Mixins(SizeMixin, BorderRadiusMixin) {
    *
    * By default, it's set to `"more-horizontal"`
    */
-  @Prop({ type: String, default: Icons.MoreHorizontal }) readonly icon!: string
+  @Prop({ type: String, default: Icons24.BasicMoreHorizontal }) readonly icon!: string
   /**
    * Button type of dropdown component. It can be used with `type="button"`.
    * Possible values: `"primary"`, `"secondary"`, `"tertiary"`.
diff --git a/src/components/Form/SFormItem.vue b/src/components/Form/SFormItem.vue
index d6e34373..8ce3c26d 100644
--- a/src/components/Form/SFormItem.vue
+++ b/src/components/Form/SFormItem.vue
@@ -13,7 +13,7 @@
   >
     <slot slot="label" name="label"></slot>
     <slot></slot>
-    <i v-if="willMessageBeShown && errorState" class="s-icon-error"></i>
+    <s-icon v-if="willMessageBeShown && errorState" name="status-error" />
   </el-form-item>
 </template>
 
@@ -21,12 +21,13 @@
 import { Vue, Component, Prop, Ref, Inject } from 'vue-property-decorator'
 import { ElFormItem } from 'element-ui/types/form-item'
 import { ElForm } from 'element-ui/types/form'
-import cloneDeep from 'lodash/cloneDeep'
 import isArray from 'lodash/isArray'
 
-import { LabelPosition } from './consts'
+import { SIcon } from '../Icon'
 
-@Component
+@Component({
+  components: { SIcon }
+})
 export default class SFormItem extends Vue {
   /**
    * A key of `model` - form property.
diff --git a/src/components/Icon/SIcon.vue b/src/components/Icon/SIcon.vue
index 0ac7c3f5..adbc44ca 100644
--- a/src/components/Icon/SIcon.vue
+++ b/src/components/Icon/SIcon.vue
@@ -4,8 +4,9 @@
 
 <script lang="ts">
 import { Vue, Component, Prop } from 'vue-property-decorator'
+import last from 'lodash/fp/last'
 
-import { Icons } from './consts'
+import { Icons16, Icons24, StatusIcons } from './consts'
 
 @Component
 export default class SIcon extends Vue {
@@ -38,7 +39,10 @@ export default class SIcon extends Vue {
     if (this.name.startsWith('el-icon')) {
       return this.name
     }
-    if (!(Object.values(Icons) as Array<string>).includes(this.name)) {
+    const is16Size = (Object.values(Icons16) as Array<string>).includes(this.name)
+    const is24Size = (Object.values(Icons24) as Array<string>).includes(this.name)
+    const isStatusIcon = (Object.values(StatusIcons) as Array<string>).includes(this.name)
+    if (!(is16Size || is24Size || isStatusIcon)) {
       console.warn(`'${this.name}' was not found`)
       return ''
     }
@@ -49,6 +53,9 @@ export default class SIcon extends Vue {
     const styles = {} as any
     if (this.size) {
       styles.fontSize = !isNaN(+this.size) ? `${this.size}px` : this.size
+    } else if (this.name.includes('16') || this.name.includes('24')) {
+      const words = this.name.split('-')
+      styles.fontSize = `${last(words)}px`
     }
     if (!this.visible) {
       styles.color = 'transparent'
diff --git a/src/components/Icon/consts.ts b/src/components/Icon/consts.ts
index 2164c195..8f2168e1 100644
--- a/src/components/Icon/consts.ts
+++ b/src/components/Icon/consts.ts
@@ -1,170 +1,576 @@
-export enum Icons {
-  Activity = 'activity',
-  ArrowBottom = 'arrow-bottom',
-  ArrowBottomLeft = 'arrow-bottom-left',
-  ArrowBottomRight = 'arrow-bottom-right',
-  ArrowBottomRounded = 'arrow-bottom-rounded',
-  ArrowLeft = 'arrow-left',
-  ArrowRight = 'arrow-right',
-  ArrowTop = 'arrow-top',
-  ArrowTopLeft = 'arrow-top-left',
-  ArrowTopRight = 'arrow-top-right',
-  ArrowTopRightRounded = 'arrow-top-right-rounded',
-  Back = 'back',
-  BarChart = 'bar-chart',
-  Book = 'book',
-  BookmarkAdd = 'bookmark-add',
-  BookmarkNo = 'bookmark-no',
-  Bookmark = 'bookmark',
-  Bookmarks = 'bookmarks',
-  Box = 'box',
-  Browser = 'browser',
-  BrowserNo = 'browser-no',
-  Brush = 'brush',
-  Build = 'build',
-  Calculator = 'calculator',
-  Calendar = 'calendar',
-  CallPhone = 'call-phone',
-  Camera = 'camera',
-  CameraCreate = 'camera-create',
-  CameraNo = 'camera-no',
-  Case = 'case',
-  ChangePositions = 'change-positions',
-  CheckMark = 'check-mark',
-  CheckMarks = 'check-marks',
-  ChevronBottom = 'chevron-bottom',
-  ChevronBottomRounded = 'chevron-bottom-rounded',
-  ChevronLeft = 'chevron-left',
-  ChevronLeftRounded = 'chevron-left-rounded',
-  ChevronRight = 'chevron-right',
-  ChevronTop = 'chevron-top',
-  ChevronsBottom = 'chevrons-bottom',
-  ChevronsLeft = 'chevrons-left',
-  ChevronsRight = 'chevrons-right',
-  Circle = 'circle',
-  CircleArrowBottom = 'circle-arrow-bottom',
-  CircleArrowLeft = 'circle-arrow-left',
-  CircleArrowRight = 'circle-arrow-right',
-  CircleArrowTop = 'circle-arrow-top',
-  CircleBlock = 'circle-block',
-  CircleChecked = 'circle-checked',
-  CircleChevronBottom = 'circle-chevron-bottom',
-  CircleChevronLeft = 'circle-chevron-left',
-  CircleChevronRight = 'circle-chevron-right',
-  CircleChevronTop = 'circle-chevron-top',
-  CircleChevronsTop = 'circle-chevrons-top',
-  CircleMenu = 'circle-menu',
-  CircleMinus = 'circle-minus',
-  CircleMoreHorizontal = 'circle-more-horizontal',
-  CircleMoreVertical = 'circle-more-vertical',
-  CirclePlus = 'circle-plus',
-  CircleStar = 'circle-star',
-  CircleX = 'circle-x',
-  ClearStyle = 'clear-style',
-  Copy = 'copy',
-  Create = 'create',
-  Cut = 'cut',
-  Dashboard = 'dashboard',
-  Delete = 'delete',
-  Download = 'download',
-  DownloadBold = 'download-bold',
-  Drop = 'drop',
-  Earn = 'earn',
-  Error = 'error',
-  ExternalLink = 'external-link',
-  Eye = 'eye',
-  EyeNo = 'eye-no',
-  File = 'file',
-  FileUpload = 'file-upload',
-  Flag = 'flag',
-  Flame = 'flame',
-  Folder = 'folder',
-  Glasses = 'glasses',
-  Globe = 'globe',
-  GlobeNo = 'globe-no',
-  Heart = 'heart',
-  HeartNo = 'heart-no',
-  Home = 'home',
-  Image = 'image',
-  Inbox = 'inbox',
-  Info = 'info',
-  Layers = 'layers',
-  Lightning = 'lightning',
-  LightningNo = 'lightning-no',
-  Link = 'link',
-  LinkNo = 'link-no',
-  Liquidity = 'liquidity',
-  List = 'list',
-  Lock = 'lock',
-  Logout = 'logout',
-  Mail = 'mail',
-  Maximize = 'maximize',
-  Menu = 'menu',
-  MenuDots = 'menu-dots',
-  Mic = 'mic',
-  MicNo = 'mic-no',
-  Minimize = 'minimize',
-  Minus = 'minus',
-  MinusRounded = 'minus-rounded',
-  Moon = 'moon',
-  MoreHorizontal = 'more-horizontal',
-  MoreVertical = 'more-vertical',
-  Newspaper = 'newspaper',
-  Options = 'options',
-  Paperclip = 'paperclip',
-  PaperclipNo = 'paperclip-no',
-  PaperclipVertical = 'paperclip-vertical',
-  Pencil = 'pencil',
-  PencilCreate = 'pencil-create',
-  PencilEdit = 'pencil-edit',
-  Pin = 'pin',
-  Play = 'play',
-  Plus = 'plus',
-  PlusRounded = 'plus-rounded',
-  Presentation = 'presentation',
-  Printer = 'printer',
-  Pulse = 'pulse',
-  QuestionCircle = 'question-circle',
-  Refresh = 'refresh',
-  Scan = 'scan',
-  Screenshot = 'screenshot',
-  Search = 'search',
-  Send = 'send',
-  Settings = 'settings',
-  Share = 'share',
-  ShareArrow = 'share-arrow',
-  Star = 'star',
-  StarNo = 'star-no',
-  Sticker = 'sticker',
-  Stop = 'stop',
-  Success = 'success',
-  Swap = 'swap',
-  table = 'table',
-  Target = 'target',
-  TextAlignCenter = 'text-align-center',
-  TextAlignJustify = 'text-align-justify',
-  TextAlignLeft = 'text-align-left',
-  TextAlignRight = 'text-align-right',
-  TextBgcolor = 'text-bgcolor',
-  TextBold = 'text-bold',
-  TextColor = 'text-color',
-  TextItalic = 'text-italic',
-  TextUnderline = 'text-underline',
-  ThumbsDown = 'thumbs-down',
-  ThumbsUp = 'thumbs-up',
-  Time = 'time',
-  ToggleLeft = 'toggle-left',
-  ToggleRight = 'toggle-right',
-  Trash = 'trash',
-  TrashEmpty = 'trash-empty',
-  User = 'user',
-  Video = 'video',
-  VideoNo = 'video-no',
-  Wallet = 'wallet',
-  Warning = 'warning',
-  WiFi = 'wi-fi',
-  X = 'x',
-  XRounded = 'x-rounded',
-  ZoomIn = 'zoom-in',
-  ZoomOut = 'zoom-out'
+export enum Icons24 {
+  ArrowsArrowBoldBottom = 'arrows-arrow-bold-bottom-24',
+  ArrowsArrowBoldForvard = 'arrows-arrow-bold-forvard-24',
+  ArrowsArrowBoldForvardAll = 'arrows-arrow-bold-forvard-all-24',
+  ArrowsArrowBoldLeft = 'arrows-arrow-bold-left-24',
+  ArrowsArrowBoldRedo = 'arrows-arrow-bold-redo-24',
+  ArrowsArrowBoldReply = 'arrows-arrow-bold-reply-24',
+  ArrowsArrowBoldReplyAll = 'arrows-arrow-bold-reply-all-24',
+  ArrowsArrowBoldRight = 'arrows-arrow-bold-right-24',
+  ArrowsArrowBoldTop = 'arrows-arrow-bold-top-24',
+  ArrowsArrowBoldUndo = 'arrows-arrow-bold-undo-24',
+  ArrowsArrowBottom = 'arrows-arrow-bottom-24',
+  ArrowsArrowBottomLeft = 'arrows-arrow-bottom-left-24',
+  ArrowsArrowBottomRight = 'arrows-arrow-bottom-right-24',
+  ArrowsArrowForward = 'arrows-arrow-forward-24',
+  ArrowsArrowForwardAll = 'arrows-arrow-forward-all-24',
+  ArrowsArrowLeft = 'arrows-arrow-left-24',
+  ArrowsArrowLeftCurved = 'arrows-arrow-left-curved-24',
+  ArrowsArrowRedo = 'arrows-arrow-redo-24',
+  ArrowsArrowReply = 'arrows-arrow-reply-24',
+  ArrowsArrowReplyAll = 'arrows-arrow-reply-all-24',
+  ArrowsArrowRight = 'arrows-arrow-right-24',
+  ArrowsArrowRightCurved = 'arrows-arrow-right-curved-24',
+  ArrowsArrowTop = 'arrows-arrow-top-24',
+  ArrowsArrowTopLeft = 'arrows-arrow-top-left-24',
+  ArrowsArrowTopRight = 'arrows-arrow-top-right-24',
+  ArrowsArrowTopRightSmall = 'arrows-arrow-top-right-small-24',
+  ArrowsArrowUndo = 'arrows-arrow-undo-24',
+  ArrowsArrowsDiagonals = 'arrows-arrows-diagonals-24',
+  ArrowsArrowsDiagonalsBltr = 'arrows-arrows-diagonals-bltr-24',
+  ArrowsArrowsDiagonalsTlbr = 'arrows-arrows-diagonals-tlbr-24',
+  ArrowsArrowsHv = 'arrows-arrows-hv-24',
+  ArrowsChevronBottom = 'arrows-chevron-bottom-24',
+  ArrowsChevronDownRounded = 'arrows-chevron-down-rounded-24',
+  ArrowsChevronLeft = 'arrows-chevron-left-24',
+  ArrowsChevronLeftRounded = 'arrows-chevron-left-rounded-24',
+  ArrowsChevronLeftXs = 'arrows-chevron-left-xs-24',
+  ArrowsChevronRight = 'arrows-chevron-right-24',
+  ArrowsChevronRightRounded = 'arrows-chevron-right-rounded-24',
+  ArrowsChevronRightXs = 'arrows-chevron-right-xs-24',
+  ArrowsChevronTop = 'arrows-chevron-top-24',
+  ArrowsChevronTopRounded = 'arrows-chevron-top-rounded-24',
+  ArrowsChevronsBottom = 'arrows-chevrons-bottom-24',
+  ArrowsChevronsLeft = 'arrows-chevrons-left-24',
+  ArrowsChevronsRight = 'arrows-chevrons-right-24',
+  ArrowsChevronsTop = 'arrows-chevrons-top-24',
+  ArrowsCircleArrowBottom = 'arrows-circle-arrow-bottom-24',
+  ArrowsCircleArrowBottomLeft = 'arrows-circle-arrow-bottom-left-24',
+  ArrowsCircleArrowBottomRight = 'arrows-circle-arrow-bottom-right-24',
+  ArrowsCircleArrowLeft = 'arrows-circle-arrow-left-24',
+  ArrowsCircleArrowLeftCurved = 'arrows-circle-arrow-left-curved-24',
+  ArrowsCircleArrowRight = 'arrows-circle-arrow-right-24',
+  ArrowsCircleArrowRight241 = 'arrows-circle-arrow-right-24-1',
+  ArrowsCircleArrowRightCurved = 'arrows-circle-arrow-right-curved-24',
+  ArrowsCircleArrowTop = 'arrows-circle-arrow-top-24',
+  ArrowsCircleArrowTopLeft = 'arrows-circle-arrow-top-left-24',
+  ArrowsCircleArrowTopRight = 'arrows-circle-arrow-top-right-24',
+  ArrowsCircleChevronBottom = 'arrows-circle-chevron-bottom-24',
+  ArrowsCircleChevronLeft = 'arrows-circle-chevron-left-24',
+  ArrowsCircleChevronRight = 'arrows-circle-chevron-right-24',
+  ArrowsCircleChevronTop = 'arrows-circle-chevron-top-24',
+  ArrowsCircleChevronsBottom = 'arrows-circle-chevrons-bottom-24',
+  ArrowsCircleChevronsLeft = 'arrows-circle-chevrons-left-24',
+  ArrowsCircleChevronsRight = 'arrows-circle-chevrons-right-24',
+  ArrowsCircleChevronsTop = 'arrows-circle-chevrons-top-24',
+  ArrowsRefreshCcw = 'arrows-refresh-ccw-24',
+  ArrowsRefreshCcwAlert = 'arrows-refresh-ccw-alert-24',
+  ArrowsRefreshCw = 'arrows-refresh-cw-24',
+  ArrowsRefreshCwAlert = 'arrows-refresh-cw-alert-24',
+  ArrowsRotateCcw = 'arrows-rotate-ccw-24',
+  ArrowsRotateCw = 'arrows-rotate-cw-24',
+  ArrowsSwap = 'arrows-swap-24',
+  ArrowsSwap90 = 'arrows-swap-90-24',
+  Basic = 'basic-24',
+  BasicBarChart = 'basic-bar-chart-24',
+  BasicBook = 'basic-book-24',
+  BasicBookmark = 'basic-bookmark-24',
+  BasicBookmarkAdd = 'basic-bookmark-add-24',
+  BasicBookmarkNo = 'basic-bookmark-no-24',
+  BasicBookmarks = 'basic-bookmarks-24',
+  BasicBox = 'basic-box-24',
+  BasicBrowser = 'basic-browser-24',
+  BasicBrowserNo = 'basic-browser-no-24',
+  BasicBrush = 'basic-brush-24',
+  BasicCalculator = 'basic-calculator-24',
+  BasicCamera = 'basic-camera-24',
+  BasicCameraCreate = 'basic-camera-create-24',
+  BasicCameraNo = 'basic-camera-no-24',
+  BasicCase = 'basic-case-24',
+  BasicCheckMark = 'basic-check-mark-24',
+  BasicCheckMarks = 'basic-check-marks-24',
+  BasicCircle = 'basic-circle-24',
+  BasicCircleBlock = 'basic-circle-block-24',
+  BasicCircleChecked = 'basic-circle-checked-24',
+  BasicCircleMenu = 'basic-circle-menu-24',
+  BasicCircleMinus = 'basic-circle-minus-24',
+  BasicCircleMoreHorizontal = 'basic-circle-more-horizontal-24',
+  BasicCircleMoreVertical = 'basic-circle-more-vertical-24',
+  BasicCirclePlus = 'basic-circle-plus-24',
+  BasicCircleStar = 'basic-circle-star-24',
+  BasicCircleX = 'basic-circle-x-24',
+  BasicClearStyle = 'basic-clear-style-24',
+  BasicClearX = 'basic-clear-X-24',
+  BasicClearXXs = 'basic-clear-X-xs-24',
+  BasicClose = 'basic-close-24',
+  BasicCopy = 'basic-copy-24',
+  BasicCut = 'basic-cut-24',
+  BasicDashboard = 'basic-dashboard-24',
+  BasicDelete = 'basic-delete-24',
+  BasicDownload = 'basic-download-24',
+  BasicDownloadBold = 'basic-download-bold-24',
+  BasicDrop = 'basic-drop-24',
+  BasicEdit = 'basic-edit-24',
+  BasicExternalLink = 'basic-external-link-24',
+  BasicEye = 'basic-eye-24',
+  BasicEyeNo = 'basic-eye-no-24',
+  BasicFilterlist = 'basic-filterlist-24',
+  BasicFlag = 'basic-flag-24',
+  BasicFlame = 'basic-flame-24',
+  BasicGlasses = 'basic-glasses-24',
+  BasicGlobe = 'basic-globe-24',
+  BasicGlobeNo = 'basic-globe-no-24',
+  BasicHeart = 'basic-heart-24',
+  BasicHeartNo = 'basic-heart-no-24',
+  BasicHome = 'basic-home-24',
+  BasicImage = 'basic-image-24',
+  BasicInbox = 'basic-inbox-24',
+  BasicLayers = 'basic-layers-24',
+  BasicLightning = 'basic-lightning-24',
+  BasicLightningNo = 'basic-lightning-no-24',
+  BasicLink = 'basic-link-24',
+  BasicLinkNo = 'basic-link-no-24',
+  BasicList = 'basic-list-24',
+  BasicMail = 'basic-mail-24',
+  BasicMaximize = 'basic-maximize-24',
+  BasicMenu = 'basic-menu-24',
+  BasicMenuDots = 'basic-menu-dots-24',
+  BasicMic = 'basic-mic-24',
+  BasicMicNo = 'basic-mic-no-24',
+  BasicMinimize = 'basic-minimize-24',
+  BasicMinus = 'basic-minus-24',
+  BasicMoreHorizontal = 'basic-more-horizontal-24',
+  BasicMoreVertical = 'basic-more-vertical-24',
+  BasicNewspaper = 'basic-newspaper-24',
+  BasicOptions = 'basic-options-24',
+  BasicOptions3 = 'basic-options-3-24',
+  BasicPaperclip = 'basic-paperclip-24',
+  BasicPaperclipNo = 'basic-paperclip-no-24',
+  BasicPencilCreate = 'basic-pencil-create-24',
+  BasicPencilEdit = 'basic-pencil-edit-24',
+  BasicPhotoPic = 'basic-photo-pic-24',
+  BasicPlaceholder = 'basic-placeholder-24',
+  BasicPlus = 'basic-plus-24',
+  BasicPresentation = 'basic-presentation-24',
+  BasicPrinter = 'basic-printer-24',
+  BasicPulse = 'basic-pulse-24',
+  BasicReceive = 'basic-receive-24',
+  BasicScan = 'basic-scan-24',
+  BasicScanCustom = 'basic-scan-custom-24',
+  BasicScreenshot = 'basic-screenshot-24',
+  BasicSearch = 'basic-search-24',
+  BasicSend = 'basic-send-24',
+  BasicSend241 = 'basic-send-24-1',
+  BasicSettings = 'basic-settings-24',
+  BasicShare = 'basic-share-24',
+  BasicShareArrow = 'basic-share-arrow-24',
+  BasicStar = 'basic-star-24',
+  BasicStarNo = 'basic-star-no-24',
+  BasicSticker = 'basic-sticker-24',
+  BasicTable = 'basic-table-24',
+  BasicTextAlignCenter = 'basic-text-align-center-24',
+  BasicTextAlignJustify = 'basic-text-align-justify-24',
+  BasicTextAlignLeft = 'basic-text-align-left-24',
+  BasicTextAlignRight = 'basic-text-align-right-24',
+  BasicTextBgcolor = 'basic-text-bgcolor-24',
+  BasicTextBold = 'basic-text-bold-24',
+  BasicTextColor = 'basic-text-color-24',
+  BasicTextItalic = 'basic-text-italic-24',
+  BasicTextUnderline = 'basic-text-underline-24',
+  BasicThumbsDown = 'basic-thumbs-down-24',
+  BasicThumbsUp = 'basic-thumbs-up-24',
+  BasicToggleLeft = 'basic-toggle-left-24',
+  BasicToggleRight = 'basic-toggle-right-24',
+  BasicTrash = 'basic-trash-24',
+  BasicTrashEmpty = 'basic-trash-empty-24',
+  BasicUser = 'basic-user-24',
+  BasicVideo = 'basic-video-24',
+  BasicVideoNo = 'basic-video-no-24',
+  BasicZoomIn = 'basic-zoom-in-24',
+  BasicZoomOut = 'basic-zoom-out-24',
+  CallCallAdd = 'call-call-add-24',
+  CallCallCalling = 'call-call-calling-24',
+  CallCallDecline = 'call-call-decline-24',
+  CallCallEnd = 'call-call-end-24',
+  CallCallForwarded = 'call-call-forwarded-24',
+  CallCallHash = 'call-call-hash-24',
+  CallCallHold = 'call-call-hold-24',
+  CallCallIncoming = 'call-call-incoming-24',
+  CallCallMissed = 'call-call-missed-24',
+  CallCallMuted = 'call-call-muted-24',
+  CallCallNo = 'call-call-no-24',
+  CallCallNumbers = 'call-call-numbers-24',
+  CallCallOutcoming = 'call-call-outcoming-24',
+  CallCallPhone = 'call-call-phone-24',
+  CallCallRecieved = 'call-call-recieved-24',
+  CallCallVoicemail = 'call-call-voicemail-24',
+  ChattingComment = 'chatting-comment-24',
+  ChattingCommentChecked = 'chatting-comment-checked-24',
+  ChattingCommentDelete = 'chatting-comment-delete-24',
+  ChattingCommentMinus = 'chatting-comment-minus-24',
+  ChattingCommentPlus = 'chatting-comment-plus-24',
+  ChattingCommentText = 'chatting-comment-text-24',
+  ChattingQuestion = 'chatting-question-24',
+  ConnectionAirplay = 'connection-airplay-24',
+  ConnectionBluetooth = 'connection-bluetooth-24',
+  ConnectionBluetoothNo = 'connection-bluetooth-no-24',
+  ConnectionBroadcast = 'connection-broadcast-24',
+  ConnectionBroadcasting = 'connection-broadcasting-24',
+  ConnectionCast = 'connection-cast-24',
+  ConnectionWiFi = 'connection-wi-fi-24',
+  ConnectionWiFiNo = 'connection-wi-fi-no-24',
+  FileClipboard = 'file-clipboard-24',
+  FileClipboardChecked = 'file-clipboard-checked-24',
+  FileClipboardDelete = 'file-clipboard-delete-24',
+  FileClipboardMinus = 'file-clipboard-minus-24',
+  FileClipboardPlus = 'file-clipboard-plus-24',
+  FileClipboardText = 'file-clipboard-text-24',
+  FileFile = 'file-file-24',
+  FileFileChecked = 'file-file-checked-24',
+  FileFileCode = 'file-file-code-24',
+  FileFileCreate = 'file-file-create-24',
+  FileFileDelete = 'file-file-delete-24',
+  FileFileDownload = 'file-file-download-24',
+  FileFileDraft = 'file-file-draft-24',
+  FileFileMinus = 'file-file-minus-24',
+  FileFilePlus = 'file-file-plus-24',
+  FileFileScan = 'file-file-scan-24',
+  FileFileShredder = 'file-file-shredder-24',
+  FileFileText = 'file-file-text-24',
+  FileFileUpload = 'file-file-upload-24',
+  FileFolder = 'file-folder-24',
+  FileFolderArrow = 'file-folder-arrow-24',
+  FileFolderChecked = 'file-folder-checked-24',
+  FileFolderCloud = 'file-folder-cloud-24',
+  FileFolderCreate = 'file-folder-create-24',
+  FileFolderDelete = 'file-folder-delete-24',
+  FileFolderMinus = 'file-folder-minus-24',
+  FileFolderMusic = 'file-folder-music-24',
+  FileFolderOpened = 'file-folder-opened-24',
+  FileFolderPhoto = 'file-folder-photo-24',
+  FileFolderPlus = 'file-folder-plus-24',
+  FileFolderZip = 'file-folder-zip-24',
+  FileNote = 'file-note-24',
+  FileNoteText = 'file-note-text-24',
+  FinanceAccountBalance = 'finance-account-balance-24',
+  FinanceBitcoin = 'finance-bitcoin-24',
+  FinanceControlPointDuplicateDeposit = 'finance-control-point-duplicate-deposit-24',
+  FinanceCreditcard = 'finance-creditcard-24',
+  FinanceCreditcardAdd = 'finance-creditcard-add-24',
+  FinanceCreditcardFace = 'finance-creditcard-face-24',
+  FinanceCreditcardIncome = 'finance-creditcard-income-24',
+  FinanceCreditcardNo = 'finance-creditcard-no-24',
+  FinanceCreditcardOutcome = 'finance-creditcard-outcome-24',
+  FinanceCreditcardScan = 'finance-creditcard-scan-24',
+  FinanceEthereumDontuse = 'finance-ethereum-dontuse-24',
+  FinanceLiquidity = 'finance-liquidity-24',
+  FinancePSWAP = 'finance-PSWAP-24',
+  FinancePaypass = 'finance-paypass-24',
+  FinanceReceive = 'finance-receive-24',
+  FinanceReceiveShowQR = 'finance-receive-show-QR-24',
+  FinanceSend = 'finance-send-24',
+  FinanceStrongbox = 'finance-strongbox-24',
+  FinanceVALerc20Outline = 'finance-VALerc20-outline-24',
+  FinanceWallet = 'finance-wallet-24',
+  FinanceXOROutline = 'finance-XOR-outline-24',
+  FoodAvocado = 'food-avocado-24',
+  FoodBread = 'food-bread-24',
+  FoodChicken = 'food-chicken-24',
+  FoodCoffee = 'food-coffee-24',
+  FoodEgg = 'food-egg-24',
+  FoodIcecream = 'food-icecream-24',
+  GadgetsBattery = 'gadgets-battery-24',
+  GadgetsBattery20 = 'gadgets-battery-20-24',
+  GadgetsBattery40 = 'gadgets-battery-40-24',
+  GadgetsBattery60 = 'gadgets-battery-60-24',
+  GadgetsBattery80 = 'gadgets-battery-80-24',
+  GadgetsBattery100 = 'gadgets-battery-100-24',
+  GadgetsBatteryCharching = 'gadgets-battery-charching-24',
+  GadgetsBatteryNo = 'gadgets-battery-no-24',
+  GadgetsDevices = 'gadgets-devices-24',
+  GadgetsFlashCard = 'gadgets-flash-card-24',
+  GadgetsFloppy = 'gadgets-floppy-24',
+  GadgetsIPad = 'gadgets-iPad-24',
+  GadgetsIPhone = 'gadgets-iPhone-24',
+  GadgetsLaptop = 'gadgets-laptop-24',
+  GadgetsMemoryCard = 'gadgets-memory-card-24',
+  GadgetsMobile = 'gadgets-mobile-24',
+  GadgetsMonitor = 'gadgets-monitor-24',
+  GadgetsServer = 'gadgets-server-24',
+  GridApps = 'grid-apps-24',
+  GridBlockAlignBottom = 'grid-block-align-bottom-24',
+  GridBlockAlignHorizontally = 'grid-block-align-horizontally-24',
+  GridBlockAlignLeft = 'grid-block-align-left-24',
+  GridBlockAlignRight = 'grid-block-align-right-24',
+  GridBlockAlignTop = 'grid-block-align-top-24',
+  GridBlockAlignVertically = 'grid-block-align-vertically-24',
+  GridBlockDistributeHorizontally = 'grid-block-distribute-horizontally-24',
+  GridBlockDistributeVertically = 'grid-block-distribute-vertically-24',
+  GridBrakePage = 'grid-brake-page-24',
+  GridEditShape = 'grid-edit-shape-24',
+  GridElements = 'grid-elements-24',
+  GridFrame = 'grid-frame-24',
+  GridGrid = 'grid-grid-24',
+  GridGrid6 = 'grid-grid-6-24',
+  GridGridCol2 = 'grid-grid-col-2-24',
+  GridGridCol3 = 'grid-grid-col-3-24',
+  GridGridDynamic = 'grid-grid-dynamic-24',
+  GridGridFrame = 'grid-grid-frame-24',
+  GridGridRow2Copy = 'grid-grid-row-2-copy-24',
+  GridGridRow2 = 'grid-grid-row-2-24',
+  GridGridRow3 = 'grid-grid-row-3-24',
+  GridGridSlides = 'grid-grid-slides-24',
+  GridGridSmall = 'grid-grid-small-24',
+  GridIframe = 'grid-iframe-24',
+  GridKanban = 'grid-kanban-24',
+  GridLayout = 'grid-layout-24',
+  GridPadding = 'grid-padding-24',
+  GridRotateLeft = 'grid-rotate-left-24',
+  GridRotateRight = 'grid-rotate-right-24',
+  GridRuller = 'grid-ruller-24',
+  GridSegment = 'grid-segment-24',
+  GridSelect = 'grid-select-24',
+  GridSelectArea = 'grid-select-area-24',
+  GridSidebarLeft = 'grid-sidebar-left-24',
+  GridSidebarRight = 'grid-sidebar-right-24',
+  GridStack = 'grid-stack-24',
+  GridStack241 = 'grid-stack-24-1',
+  GridText = 'grid-text-24',
+  Maps360 = 'maps-360-24',
+  MapsCompas = 'maps-compas-24',
+  MapsDirection = 'maps-direction-24',
+  MapsDirection45 = 'maps-direction-45-24',
+  MapsGlobe = 'maps-globe-24',
+  MapsLocation = 'maps-location-24',
+  MapsLocationNo = 'maps-location-no-24',
+  MapsMap = 'maps-map-24',
+  MapsMapPinLocation = 'maps-map-pin-location-24',
+  MapsPanorama = 'maps-panorama-24',
+  MapsPin = 'maps-pin-24',
+  MapsPinAdd = 'maps-pin-add-24',
+  MapsPinNo = 'maps-pin-no-24',
+  MapsPinQuestion = 'maps-pin-question-24',
+  MapsPinRound = 'maps-pin-round-24',
+  MapsPinStart = 'maps-pin-start-24',
+  MapsRadar = 'maps-radar-24',
+  MapsRoute = 'maps-route-24',
+  MusicAddToLibrary = 'music-add-to-library-24',
+  MusicArtist = 'music-artist-24',
+  MusicCD = 'music-CD-24',
+  MusicEject = 'music-eject-24',
+  MusicEqualizer = 'music-equalizer-24',
+  MusicListenLater = 'music-listen-later-24',
+  MusicMusicLibrary = 'music-music-library-24',
+  MusicMusicNote = 'music-music-note-24',
+  MusicPlayerFastBack = 'music-player-fast-back-24',
+  MusicPlayerFastForward = 'music-player-fast-forward-24',
+  MusicPlayerList = 'music-player-list-24',
+  MusicPlayerListAdd = 'music-player-list-add-24',
+  MusicPlayerListPlay = 'music-player-list-play-24',
+  MusicPlayerPause = 'music-player-pause-24',
+  MusicPlayerPauseCircle = 'music-player-pause-circle-24',
+  MusicPlayerPlay = 'music-player-play-24',
+  MusicPlayerPlayCircle = 'music-player-play-circle-24',
+  MusicPlayerPlayPause = 'music-player-play-pause-24',
+  MusicPlayerSkipBack = 'music-player-skip-back-24',
+  MusicPlayerSkipForward = 'music-player-skip-forward-24',
+  MusicPlayerStop = 'music-player-stop-24',
+  MusicPlayerStopCircle = 'music-player-stop-circle-24',
+  MusicQueue = 'music-queue-24',
+  MusicRadio = 'music-radio-24',
+  MusicRecord = 'music-record-24',
+  MusicRepeat = 'music-repeat-24',
+  MusicShuffle = 'music-shuffle-24',
+  MusicSoundWave = 'music-sound-wave-24',
+  MusicTuner = 'music-tuner-24',
+  MusicVolume = 'music-volume-24',
+  MusicVolumeHigh = 'music-volume-high-24',
+  MusicVolumeLow = 'music-volume-low-24',
+  MusicVolumeNo = 'music-volume-no-24',
+  MusicVolumeOff = 'music-volume-off-24',
+  NotificationsAlertCircle = 'notifications-alert-circle-24',
+  NotificationsAlertOctagon = 'notifications-alert-octagon-24',
+  NotificationsAlertTriangle = 'notifications-alert-triangle-24',
+  NotificationsAppNotification = 'notifications-app-notification-24',
+  NotificationsBell = 'notifications-bell-24',
+  NotificationsBellAdd = 'notifications-bell-add-24',
+  NotificationsBellAlert = 'notifications-bell-alert-24',
+  NotificationsBellChecked = 'notifications-bell-checked-24',
+  NotificationsBellMinus = 'notifications-bell-minus-24',
+  NotificationsBellNo = 'notifications-bell-no-24',
+  NotificationsInfo = 'notifications-info-24',
+  NotificationsMinusOctagon = 'notifications-minus-octagon-24',
+  NotificationsQuestionCircle = 'notifications-question-circle-24',
+  NotificationsXOctagon = 'notifications-x-octagon-24',
+  ReactionsLaughing = 'reactions-laughing-24',
+  ReactionsNeutral = 'reactions-neutral-24',
+  ReactionsSad = 'reactions-sad-24',
+  ReactionsShocked = 'reactions-shocked-24',
+  ReactionsSmiled = 'reactions-smiled-24',
+  SecurityFaceID = 'security-face-ID-24',
+  SecurityKey = 'security-key-24',
+  SecurityKeyNo = 'security-key-no-24',
+  SecurityLock = 'security-lock-24',
+  SecurityLockCircle = 'security-lock-circle-24',
+  SecurityLockNo = 'security-lock-no-24',
+  SecurityLogout = 'security-logout-24',
+  SecurityShield = 'security-shield-24',
+  SecurityShieldLock = 'security-shield-lock-24',
+  SecurityShieldNo = 'security-shield-no-24',
+  SecurityShieldOk = 'security-shield-ok-24',
+  SecurityUnlock = 'security-unlock-24',
+  SecurityVerified = 'security-verified-24',
+  ShoppingBag = 'shopping-bag-24',
+  ShoppingBascket = 'shopping-bascket-24',
+  ShoppingCart = 'shopping-cart-24',
+  ShoppingCoupon = 'shopping-coupon-24',
+  ShoppingCutCoupon = 'shopping-cut-coupon-24',
+  ShoppingDelivery = 'shopping-delivery-24',
+  ShoppingDiscount = 'shopping-discount-24',
+  ShoppingFilter = 'shopping-filter-24',
+  ShoppingGift = 'shopping-gift-24',
+  ShoppingPos = 'shopping-pos-24',
+  ShoppingTag = 'shopping-tag-24',
+  ShoppingTote = 'shopping-tote-24',
+  SoftwareCloud = 'software-cloud-24',
+  SoftwareCloudChecked = 'software-cloud-checked-24',
+  SoftwareCloudConnect = 'software-cloud-connect-24',
+  SoftwareCloudDownload = 'software-cloud-download-24',
+  SoftwareCloudNo = 'software-cloud-no-24',
+  SoftwareCloudUpload = 'software-cloud-upload-24',
+  SoftwareCode = 'software-code-24',
+  SoftwareDatabase = 'software-database-24',
+  SoftwareTerminal = 'software-terminal-24',
+  Symbols0 = 'symbols-0-24',
+  Symbols = 'symbols-24',
+  SymbolsAtSign = 'symbols-at-sign-24',
+  SymbolsBehance = 'symbols-behance-24',
+  SymbolsCommand = 'symbols-command-24',
+  SymbolsDribbble = 'symbols-dribbble-24',
+  SymbolsFacebook = 'symbols-facebook-24',
+  SymbolsGithub = 'symbols-github-24',
+  SymbolsGitlab = 'symbols-gitlab-24',
+  SymbolsGoogle = 'symbols-google-24',
+  SymbolsHash = 'symbols-hash-24',
+  SymbolsInstagram = 'symbols-instagram-24',
+  SymbolsLinkedin = 'symbols-linkedin-24',
+  SymbolsPeace = 'symbols-peace-24',
+  SymbolsTelegram = 'symbols-telegram-24',
+  SymbolsTwitter = 'symbols-twitter-24',
+  SymbolsYoutube = 'symbols-youtube-24',
+  TimeAlarm = 'time-alarm-24',
+  TimeAlarmChecked = 'time-alarm-checked-24',
+  TimeAlarmMinus = 'time-alarm-minus-24',
+  TimeAlarmNo = 'time-alarm-no-24',
+  TimeAlarmPlus = 'time-alarm-plus-24',
+  TimeAlarmSnooze = 'time-alarm-snooze-24',
+  TimeCalendar = 'time-calendar-24',
+  TimeCalendarChecked = 'time-calendar-checked-24',
+  TimeCalendarCreate = 'time-calendar-create-24',
+  TimeCalendarDates = 'time-calendar-dates-24',
+  TimeCalendarDelete = 'time-calendar-delete-24',
+  TimeCalendarMinus = 'time-calendar-minus-24',
+  TimeCalendarPlus = 'time-calendar-plus-24',
+  TimeStopwatch = 'time-stopwatch-24',
+  TimeTime = 'time-time-24',
+  TimeTimeHistory = 'time-time-history-24',
+  TimeTimer = 'time-timer-24',
+  TimeWatch = 'time-watch-24',
+  VariousAdvertisement = 'various-advertisement-24',
+  VariousAtom = 'various-atom-24',
+  VariousBone = 'various-bone-24',
+  VariousBrightnessHigh = 'various-brightness-high-24',
+  VariousBrightnessLow = 'various-brightness-low-24',
+  VariousContrast = 'various-contrast-24',
+  VariousCross = 'various-cross-24',
+  VariousCrosshairs = 'various-crosshairs-24',
+  VariousCup = 'various-cup-24',
+  VariousForm = 'various-form-24',
+  VariousInfinity = 'various-infinity-24',
+  VariousItems = 'various-items-24',
+  VariousLightbulb = 'various-lightbulb-24',
+  VariousMoon = 'various-moon-24',
+  VariousNut = 'various-nut-24',
+  VariousPlanet = 'various-planet-24',
+  VariousPocket = 'various-pocket-24',
+  VariousRocket = 'various-rocket-24',
+  VariousSun = 'various-sun-24',
+  VariousToyHorse = 'various-toy-horse-24'
+}
+
+export enum Icons16 {
+  ArrowBottom = 'arrow-bottom-16',
+  ArrowBottomLeft = 'arrow-bottom-left-16',
+  ArrowBottomRight = 'arrow-bottom-right-16',
+  ArrowLeft = 'arrow-left-16',
+  ArrowRight = 'arrow-right-16',
+  ArrowTop = 'arrow-top-16',
+  ArrowTopLeft = 'arrow-top-left-16',
+  ArrowTopRight = 'arrow-top-right-16',
+  Bookmark = 'bookmark-16',
+  Browser = 'browser-16',
+  Calendar = 'calendar-16',
+  CallPhone = 'call-phone-16',
+  Camera = 'camera-16',
+  ChevronBottom = 'chevron-bottom-16',
+  ChevronDownRounded = 'chevron-down-rounded-16',
+  ChevronLeft = 'chevron-left-16',
+  ChevronRight = 'chevron-right-16',
+  ChevronTop = 'chevron-top-16',
+  ChevronUpRounded = 'chevron-up-rounded-16',
+  ChevronsBottom = 'chevrons-bottom-16',
+  ChevronsLeft = 'chevrons-left-16',
+  ChevronsRight = 'chevrons-right-16',
+  CircleArrowBottom = 'circle-arrow-bottom-16',
+  CircleArrowLeft = 'circle-arrow-left-16',
+  CircleArrowRight = 'circle-arrow-right-16',
+  CircleArrowTop = 'circle-arrow-top-16',
+  CircleChevronBottom = 'circle-chevron-bottom-16',
+  CircleChevronLeft = 'circle-chevron-left-16',
+  CircleChevronRight = 'circle-chevron-right-16',
+  CircleChevronTop = 'circle-chevron-top-16',
+  CircleChevronsTop = 'circle-chevrons-top-16',
+  CircleMinus = 'circle-minus-16',
+  CirclePlus = 'circle-plus-16',
+  CircleX = 'circle-x-16',
+  ClearX = 'clear-X-16',
+  ClearXXs = 'clear-X-xs-16',
+  Copy = 'copy-16',
+  CopyThin = 'copy-thin-16',
+  ExternalLink = 'external-link-16',
+  Eye = 'eye-16',
+  File = 'file-16',
+  Folder = 'folder-16',
+  Globe = 'globe-16',
+  Heart = 'heart-16',
+  Refresh = 'refresh-16',
+  Info = 'info-16',
+  Lock = 'lock-16',
+  Mail = 'mail-16',
+  Menu = 'menu-16',
+  Minus = 'minus-16',
+  Note = 'note-16',
+  Options = 'options-16',
+  Paperclip = 'paperclip-16',
+  PaperclipVertical = 'paperclip-vertical-16',
+  Pencil = 'pencil-16',
+  Pin = 'pin-16',
+  Plus = 'plus-16',
+  Printer = 'printer-16',
+  QuestionCircle = 'question-circle-16',
+  Search = 'search-16',
+  Star = 'star-16',
+  StatusErrorIc = 'status-error-ic-16',
+  StatusPendingIc = 'status-pending-ic-16',
+  StatusSuccessIc = 'status-success-ic-16',
+  Target = 'target-16',
+  Time = 'time-16',
+  WiFi = 'wi-fi-16',
+  X = 'x-16'
+}
+
+export enum StatusIcons {
+  Error = 'status-error',
+  Pending = 'status-pending',
+  Success = 'status-success'
 }
diff --git a/src/components/Icon/index.ts b/src/components/Icon/index.ts
index 03323d1c..25753820 100644
--- a/src/components/Icon/index.ts
+++ b/src/components/Icon/index.ts
@@ -1,4 +1,4 @@
 import SIcon from './SIcon.vue'
-import { Icons } from './consts'
+import { Icons16, Icons24 } from './consts'
 
-export { SIcon, Icons }
+export { SIcon, Icons16, Icons24 }
diff --git a/src/components/Input/SInput.vue b/src/components/Input/SInput.vue
index fd2f9693..0f6d5bba 100644
--- a/src/components/Input/SInput.vue
+++ b/src/components/Input/SInput.vue
@@ -34,7 +34,7 @@
       <slot slot="suffix" name="suffix"></slot>
     </el-input>
     <template v-if="type === InputType.TEXT_FILE">
-      <i class="s-icon-file-upload"></i>
+      <s-icon name="file-file-upload-24" />
       <input :value="emptyValue" type="file" :accept="accept" @change="handleTextFileChange">
     </template>
   </div>
@@ -45,10 +45,13 @@ import { Component, Mixins, Prop, Ref, Inject } from 'vue-property-decorator'
 import { ElInput } from 'element-ui/types/input'
 import { ElForm } from 'element-ui/types/form'
 
+import { SIcon } from '../Icon'
 import BorderRadiusMixin from '../../mixins/BorderRadiusMixin'
 import { Autocomplete, InputSize, InputType } from './consts'
 
-@Component
+@Component({
+  components: { SIcon }
+})
 export default class SInput extends Mixins(BorderRadiusMixin) {
   readonly InputType = InputType
   readonly emptyValue = null
diff --git a/src/stories/Intro/Typography.stories.ts b/src/stories/Intro/Typography.stories.ts
index 70040d3a..1514cf79 100644
--- a/src/stories/Intro/Typography.stories.ts
+++ b/src/stories/Intro/Typography.stories.ts
@@ -1,32 +1,110 @@
+import { SDivider } from '../../components'
+
 export default {
   title: 'Design System/Intro/Typography'
 }
 
 export const basic = () => ({
-  template: `<div class="s-flex" style="flex: 1; flex-direction: column; justify-content: space-between; height: 600px;">
+  components: { SDivider },
+  template: `<div class="s-flex" style="flex: 1; flex-direction: column; justify-content: space-between;">
+                 <div class="d1">
+                   [d1]
+                   Soramitsu's clients  count on us to help them design and launch their next-generation financial applications, at a lower cost and in record time. Iroha has essential functionality for your asset and identity management needs.
+                 </div>
+                 <s-divider />
+                 <div class="d2">
+                   [d2]
+                   Soramitsu's clients  count on us to help them design and launch their next-generation financial applications, at a lower cost and in record time. Iroha has essential functionality for your asset and identity management needs.
+                 </div>
+                 <s-divider />
                  <h1>
                    [h1]
                    Soramitsu's clients  count on us to help them design and launch their next-generation financial applications, at a lower cost and in record time. Iroha has essential functionality for your asset and identity management needs.
                  </h1>
+                 <s-divider />
                  <h2>
                    [h2]
                    Hyperledger project of Linux Foundation owns that code. Which means that you can create any applications based on Iroha.
                  </h2>
+                 <s-divider />
                  <h3>
                    [h3]
                    Often enough, truly decentralized solutions are not available for payment due to delays in receiving confirmations or due to overcomplexity of the technology.
                  </h3>
+                 <s-divider />
                  <h4>
                    [h4]
                    Hyperledger Iroha is a straightforward DLT, inspired by Japanese Kaizen principle — eliminate excessiveness (muri). Iroha has essential functionality for your asset and identity management needs, at the same time being an efficient and trustworthy byzantine fault-tolerant tool for your enterprise needs.
                  </h4>
+                 <s-divider />
                  <h5>
                    [h5]
                    With the support of multi-signature transactions, it is possible to maintain a fund by many managers. The fund assets should be held at one account. Its signatories should be fund managers, who are dealing with investments and portfolio distributions.
                  </h5>
+                 <s-divider />
                  <h6>
                    [h6]
                    Sora is a decentralized economy that provides its citizens various opportunities to decide which projects and ideas should be supported and which ones should not - that way everyone benefits from making the economy stronger and the world - better.
                  </h6>
+                 <s-divider />
+                 <div class="h7">
+                   [h7]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="ch1">
+                   [ch1]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="ch2">
+                   [ch2]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="ch3">
+                   [ch3]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="p1">
+                   [p1]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="p2">
+                   [p2]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="p3">
+                   [p3]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
+                 <s-divider />
+                 <div class="p4">
+                   [p4]
+                   We were hired to build Polkaswap, a decentralized exchange for the Polkadot ecosystem, capable of competing with traditional centralized exchanges. Based on Hyperledger Iroha v2, it will bridge to the Kusama and Polkadot networks, allowing users to swap between Substrate tokens. Polkaswap will provide a framework that allows us to connect many blockchains using bridges and become an exchange to connect Polkadot participants and other blockchains in the effective trading of assets.
+                 </div>
                </div>`
 })
+
+const fontWeightValues = [100, 200, 300, 400, 500, 600, 700, 800, 900]
+export const soraFont = () => ({
+  components: { SDivider },
+  template: `<div class="s-flex" style="flex: 1; flex-direction: column; justify-content: space-between;">
+               <h3>Sora Font with different font-weight values</h3>
+               <template v-for="item in items">
+                 <s-divider />
+                 <h3 :style="{ fontWeight: item }">
+                   [font-weight: {{ item }}]
+                   Often enough, truly decentralized solutions are not available for payment due to delays in receiving confirmations or due to overcomplexity of the technology.
+                 </h3>
+               </template>
+             </div>`,
+  props: {
+    items: {
+      default: () => fontWeightValues
+    }
+  }
+})
diff --git a/src/stories/Menu/SMenu.stories.ts b/src/stories/Menu/SMenu.stories.ts
index 01e7ab66..61735ded 100644
--- a/src/stories/Menu/SMenu.stories.ts
+++ b/src/stories/Menu/SMenu.stories.ts
@@ -1,5 +1,5 @@
 import { select } from '@storybook/addon-knobs'
-import { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu } from '../../components'
+import { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu, SIcon } from '../../components'
 import { BorderRadius } from '../../types'
 
 export default {
@@ -9,7 +9,7 @@ export default {
 }
 
 export const basicMenu = () => ({
-  components: { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu },
+  components: { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu, SIcon },
   template: `<s-aside width="220px">
                <s-menu
                  default-active="1"
@@ -19,21 +19,21 @@ export const basicMenu = () => ({
                  @close="handleClose">
                  <s-menu-item-group>
                    <s-menu-item index="1">
-                     <i class="s-icon-globe"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Iroha networks</span>
                    </s-menu-item>
                    <s-menu-item index="2">
-                     <i class="s-icon-activity"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Monitoring</span>
                    </s-menu-item>
                    <s-menu-item index="3">
-                     <i class="s-icon-activity"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Logs</span>
                    </s-menu-item>
                  </s-menu-item-group>
                  <s-menu-item-group>
                    <s-menu-item index="4">
-                     <i class="s-icon-logout"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Log out</span>
                    </s-menu-item>
                  </s-menu-item-group>
@@ -58,7 +58,7 @@ export const basicMenu = () => ({
 })
 
 export const sideBar = () => ({
-  components: { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu },
+  components: { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu, SIcon },
   template: `<s-aside width="220px">
                <s-menu
                  default-active="2"
@@ -68,7 +68,7 @@ export const sideBar = () => ({
                  @close="handleClose">
                  <s-submenu index="1">
                    <template slot="title">
-                     <i class="s-icon-globe"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Navigator One</span>
                    </template>
                    <s-menu-item-group title="Group One">
@@ -85,15 +85,15 @@ export const sideBar = () => ({
                    </s-submenu>
                  </s-submenu>
                  <s-menu-item index="2">
-                   <i class="s-icon-activity"></i>
+                   <s-icon name="basic-globe-24" />
                    <span>Navigator Two</span>
                  </s-menu-item>
                  <s-menu-item index="3" disabled>
-                   <i class="s-icon-globe"></i>
+                   <s-icon name="basic-globe-24" />
                    <span>Navigator Three</span>
                  </s-menu-item>
                  <s-menu-item index="4">
-                   <i class="s-icon-activity"></i>
+                   <s-icon name="basic-globe-24" />
                    <span>Navigator Four</span>
                  </s-menu-item>
                </s-menu>
diff --git a/src/stories/Menu/SMenuItem.stories.ts b/src/stories/Menu/SMenuItem.stories.ts
index 54a22282..ffcc5f12 100644
--- a/src/stories/Menu/SMenuItem.stories.ts
+++ b/src/stories/Menu/SMenuItem.stories.ts
@@ -1,4 +1,4 @@
-import { SMenu, SMenuItem } from '../../components'
+import { SMenu, SMenuItem, SIcon } from '../../components'
 
 export default {
   component: SMenuItem,
@@ -6,10 +6,10 @@ export default {
 }
 
 export const defaultUsage = () => ({
-  components: { SMenu, SMenuItem },
+  components: { SMenu, SMenuItem, SIcon },
   template: `<s-menu>
                <s-menu-item index="1">
-                 <i class="s-icon-globe"></i>
+                 <s-icon name="basic-globe-24" />
                  <span>Menu Item</span>
                </s-menu-item>
              </s-menu>`
diff --git a/src/stories/Menu/SMenuItemGroup.stories.ts b/src/stories/Menu/SMenuItemGroup.stories.ts
index 83382ee3..50ff9ef7 100644
--- a/src/stories/Menu/SMenuItemGroup.stories.ts
+++ b/src/stories/Menu/SMenuItemGroup.stories.ts
@@ -1,4 +1,4 @@
-import { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu } from '../../components'
+import { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu, SIcon } from '../../components'
 
 export default {
   component: SMenuItemGroup,
@@ -7,22 +7,22 @@ export default {
 }
 
 export const basicMenu = () => ({
-  components: { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu },
+  components: { SAside, SMenu, SMenuItem, SMenuItemGroup, SSubmenu, SIcon },
   template: `<s-aside width="220px">
                <s-menu default-active="1">
                  <s-menu-item-group title="First group">
                    <s-menu-item index="1">
-                     <i class="s-icon-globe"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>First item</span>
                    </s-menu-item>
                    <s-menu-item index="2">
-                     <i class="s-icon-activity"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Second item</span>
                    </s-menu-item>
                  </s-menu-item-group>
                  <s-menu-item-group title="Second group">
                    <s-menu-item index="4">
-                     <i class="s-icon-logout"></i>
+                     <s-icon name="basic-globe-24" />
                      <span>Third item</span>
                    </s-menu-item>
                  </s-menu-item-group>
diff --git a/src/stories/SButton.stories.ts b/src/stories/SButton.stories.ts
index a0d61544..6b90d8c3 100644
--- a/src/stories/SButton.stories.ts
+++ b/src/stories/SButton.stories.ts
@@ -17,7 +17,7 @@ export const configurable = () => ({
                :disabled="disabled"
                :loading="loading"
                :tooltip="tooltip"
-               :icon="type === 'action' ? 'back' : ''"
+               :icon="type === 'action' ? 'arrow-left-16' : ''"
                :type="type"
                :size="size"
                :border-radius="borderRadius"
@@ -62,7 +62,7 @@ export const differentTypeButtonsData = Object.values(ButtonTypes).map(type => {
   const label = type[0].toUpperCase() + type.slice(1)
   const data = { type } as any
   if (type === ButtonTypes.ACTION) {
-    data.icon = 'back'
+    data.icon = 'refresh-16'
     data.tooltip = label
   } else {
     data.label = label
@@ -171,22 +171,22 @@ export const loading = () => ({
   }
 })
 
-export const withIcon = () => ({
+const withIcon = (icon: string) => ({
   components: { SButton, SRow, SCol, SMain },
   template: `<s-main>
                <s-row :gutter="20">
                  <s-col :span="6" v-for="item in differentTypesData" :key="item.type" style="padding-bottom: 20px;">
-                   <s-button size="big" icon="refresh" :icon-position="iconPosition" :type="item.type" :tooltip="item.tooltip">
+                   <s-button size="big" :icon="icon" :icon-position="iconPosition" :type="item.type" :tooltip="item.tooltip">
                      {{ item.label }}
                    </s-button>
                  </s-col>
                  <s-col :span="6" v-for="item in differentTypesData" :key="item.type + 'Disabled'" style="padding-bottom: 20px;">
-                   <s-button size="big" icon="refresh" :icon-position="iconPosition" :type="item.type" :tooltip="item.tooltip" disabled>
+                   <s-button size="big" :icon="icon" :icon-position="iconPosition" :type="item.type" :tooltip="item.tooltip" disabled>
                      {{ item.label }}
                    </s-button>
                  </s-col>
                  <s-col :span="4" v-for="item in differentSizeData" :key="item.size">
-                   <s-button :size="item.size" icon="refresh" :icon-position="iconPosition">
+                   <s-button :size="item.size" :icon="icon" :icon-position="iconPosition">
                      {{ item.label }}
                    </s-button>
                  </s-col>
@@ -202,9 +202,16 @@ export const withIcon = () => ({
     iconPosition: {
       default: select('IconPosition', Object.values(ButtonIconPosition), ButtonIconPosition.LEFT)
     }
-  }
+  },
+  data: () => ({
+    icon
+  })
 })
 
+export const withIcon16 = withIcon('refresh-16')
+
+export const withIcon24 = withIcon('arrows-swap-24')
+
 export const buttonGroup = () => ({
   components: { SButton, SButtonGroup, SRow },
   template: `<s-row class="s-flex" style="flex: 1; justify-content: space-between; align-items: center;">
diff --git a/src/stories/SIcon.stories.ts b/src/stories/SIcon.stories.ts
index d8cda33c..6954062a 100644
--- a/src/stories/SIcon.stories.ts
+++ b/src/stories/SIcon.stories.ts
@@ -1,7 +1,7 @@
 import { withKnobs, select, number } from '@storybook/addon-knobs'
 
 import { SCol, SRow, SMain, SIcon } from '../components'
-import { Icons } from '../components/Icon'
+import { Icons16, Icons24 } from '../components/Icon'
 
 export default {
   component: SIcon,
@@ -18,7 +18,7 @@ export const configurable = () => ({
              </s-main>`,
   props: {
     name: {
-      default: select('Name', Object.values(Icons), Icons.Activity)
+      default: select('Name', [...Object.values(Icons16), ...Object.values(Icons24)], Icons16.Refresh)
     },
     size: {
       default: number('Icon Size', 16)
@@ -26,7 +26,7 @@ export const configurable = () => ({
   }
 })
 
-export const allIcons = () => ({
+const showIconsSet = (iconsEnum: any) => ({
   components: { SMain, SRow, SCol, SIcon },
   template: `<s-main>
                <s-row :gutter="20">
@@ -37,12 +37,16 @@ export const allIcons = () => ({
                    class="s-flex"
                    style="flex-direction: column; padding-bottom: 20px;"
                  >
-                   <s-icon :name="icon" :size="18" />
+                   <s-icon :name="icon" />
                    <span style="font-size: 12px;">s-icon-{{ icon }}</span>
                  </s-col>
                </s-row>
              </s-main>`,
   data: () => ({
-    icons: Object.values(Icons)
+    icons: Object.values(iconsEnum)
   })
 })
+
+export const iconsWith16pxSize = () => showIconsSet(Icons16)
+
+export const iconsWith24pxSize = () => showIconsSet(Icons24)
diff --git a/src/styles/button.scss b/src/styles/button.scss
index 1405704d..c9d80ba7 100644
--- a/src/styles/button.scss
+++ b/src/styles/button.scss
@@ -39,6 +39,14 @@ $s-color-button-tertiary-background-focused: var(--s-color-base-background) !def
   }
 }
 .el-button {
+  &.s-medium {
+    padding-top: 7px;
+    padding-bottom: 7px;
+  }
+  &.s-small {
+    padding-top: 3px;
+    padding-bottom: 3px;
+  }
   &.s-primary {
     background-color: var(--s-color-theme-accent);
     border-color: var(--s-color-theme-accent);
@@ -119,18 +127,16 @@ $s-color-button-tertiary-background-focused: var(--s-color-base-background) !def
     }
     &.s-medium {
       width: $s-size-medium;
-      padding: 10px;
+      padding: 7px;
       i {
         font-size: var(--s-icon-font-size-small);
       }
     }
     &.s-small {
       width: $s-size-small;
-      padding: 9px;
+      padding: 3px;
       i {
         font-size: var(--s-icon-font-size-mini);
-        margin-left: -2px;
-        margin-top: -2px;
       }
     }
     color: var(--s-color-base-content-primary);
@@ -157,6 +163,11 @@ $s-color-button-tertiary-background-focused: var(--s-color-base-background) !def
     font-feature-settings: var(--s-font-feature-settings-heading);
     @include font-weight(700, true);
   }
+  &:not(.s-action) > span {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
 }
 button {
   > span > i {
diff --git a/src/styles/collapse.scss b/src/styles/collapse.scss
index 4f3c6cba..f0efcd3a 100644
--- a/src/styles/collapse.scss
+++ b/src/styles/collapse.scss
@@ -29,7 +29,7 @@
     }
     .el-icon-arrow-right {
       font-family: $s-font-family-icons;
-      @extend .s-icon-chevron-bottom;
+      @extend .s-icon-chevron-down-rounded-16;
       font-size: var(--s-icon-font-size-mini);
       padding: 8px;
       width: 32px;
diff --git a/src/styles/common.scss b/src/styles/common.scss
index bf75e909..5f400cec 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -13,62 +13,141 @@ html {
   margin: 0;
 }
 
+.d1 {
+  font-size: var(--s-heading0-font-size);
+}
+
 /* Typography */
-h1, h2, h3, h4, h5, h6 {
-  font-family: $s-font-family-default;
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6, .h7,
+.d2,
+.ch1, .ch2,
+.p1 {
+  @include font-weight(400);
   font-feature-settings: var(--s-font-feature-settings-heading);
 }
 
-h1, h2, h3, h4 {
-  @include font-weight(400);
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6, .h7,
+.d1, .d2,
+.ch1, .ch2, .ch3,
+.p1, .p2, .p3, .p4 {
+  font-family: $s-font-family-default;
+  font-feature-settings: var(--s-font-feature-settings-heading);
 }
 
-h1, h2 {
+h1, h2,
+.h1, .h2 {
   letter-spacing: var(--s-letter-spacing-mini);
 }
 
-h1 {
+h1,
+.h1,
+.d1 {
+  line-height: var(--s-line-height-mini);
+}
+
+h1,
+.h1 {
   font-size: var(--s-heading1-font-size);
   line-height: var(--s-line-height-mini);
 }
 
-h2 {
+h2,
+.h2,
+.d2 {
   font-size: var(--s-heading2-font-size);
 }
 
-h2, h3 {
+h2, h3,
+.h2, .h3,
+.d2,
+.ch1, .ch2 {
   line-height: var(--s-line-height-small);
 }
 
-h3, h4 {
+h3, h4,
+.h3, .h4,
+.d1 {
   letter-spacing: var(--s-letter-spacing-small);
 }
 
-h3 {
+h3,
+.h3 {
   font-size: var(--s-heading3-font-size);
 }
 
-h4, h5, h6 {
+h4, h5, h6,
+.h4, .h5, .h6, .h7 {
   line-height: var(--s-line-height-medium);
 }
 
-h4 {
+h4,
+.h4 {
   font-size: var(--s-heading4-font-size);
 }
 
-h5, h6 {
+h5, h6,
+.h5, .h6, .h7,
+.d1, .d2,
+.ch1, .ch2, .ch3 {
   @include font-weight(700);
 }
 
-h5 {
+h5,
+.h5,
+.p1 {
   font-size: var(--s-heading5-font-size);
   letter-spacing: var(--s-letter-spacing-big);
 }
 
-h6 {
+h5,
+.h5,
+.ch1 {
+  letter-spacing: var(--s-letter-spacing-big);
+}
+
+h6,
+.h6,
+.ch1,
+.p2,
+.p3 {
   font-size: var(--s-heading6-font-size);
 }
 
+.h7,
+.ch2,
+.p4 {
+  font-size: var(--s-heading7-font-size);
+}
+
+.ch1, .ch2, .ch3 {
+  text-transform: uppercase;
+}
+
+.ch2 {
+  letter-spacing: var(--s-letter-spacing-large);
+}
+
+.ch3 {
+  letter-spacing: var(--s-letter-spacing-extra-large);
+  line-height: var(--s-line-height-base);
+  font-size: var(--s-heading8-font-size);
+  font-feature-settings: var(--s-font-feature-settings-caps);
+}
+
+.p1 {
+  line-height: 1.7; // TODO: think about this case
+}
+
+.p2 {
+  @include font-weight(600);
+}
+
+.p2, .p3, .p4 {
+  line-height: var(--s-line-height-big);
+}
+
 .s-flex {
   display: flex;
 }
diff --git a/src/styles/datepicker.scss b/src/styles/datepicker.scss
index f85aed5f..e289ae77 100644
--- a/src/styles/datepicker.scss
+++ b/src/styles/datepicker.scss
@@ -149,7 +149,7 @@ $date-picker-padding: 8px;
         }
       }
     }
-    .s-icon-chevron-bottom {
+    .s-icon-chevron-down-rounded-16 {
       position: absolute;
       right: 10px;
       top: calc(50% - 8px);
@@ -162,12 +162,12 @@ $date-picker-padding: 8px;
       .el-date-editor .el-input__inner {
         border-color: var(--s-color-base-border-primary);
       }
-      &:not(.disabled) .s-icon-chevron-bottom {
+      &:not(.disabled) .s-icon-chevron-down-rounded-16 {
         transform: rotate(180deg);
       }
     }
     &.s-has-value {
-      .s-icon-chevron-bottom {
+      .s-icon-chevron-down-rounded-16 {
         color: var(--s-color-base-content-primary);
       }
     }
@@ -191,7 +191,7 @@ $date-picker-padding: 8px;
           color: var(--s-color-base-content-quaternary);
         }
       }
-      .s-icon-chevron-bottom {
+      .s-chevron-down-rounded-16 {
         color: var(--s-color-base-content-quaternary);
       }
     }
diff --git a/src/styles/fonts.scss b/src/styles/fonts.scss
index a38a3c6b..71134b84 100644
--- a/src/styles/fonts.scss
+++ b/src/styles/fonts.scss
@@ -1,6 +1,6 @@
 @font-face {
   font-family: "soramitsu-icons";
-  src: url("~@/assets/fonts/soramitsu-icons-1.0.0.woff");
+  src: url("~@/assets/fonts/soramitsu-icons-1.0.0.ttf") format("truetype");
   font-weight: normal;
   font-style: normal;
   font-display: block;
diff --git a/src/styles/form.scss b/src/styles/form.scss
index 25014119..dead6879 100644
--- a/src/styles/form.scss
+++ b/src/styles/form.scss
@@ -57,7 +57,7 @@
         }
       }
     }
-    .s-icon-error {
+    .s-icon-status-error {
       position: absolute;
       bottom: 6px;
       left: 4px;
diff --git a/src/styles/icons.scss b/src/styles/icons.scss
index ee98cbc5..049b7745 100644
--- a/src/styles/icons.scss
+++ b/src/styles/icons.scss
@@ -11,1000 +11,3396 @@
 }
 $icons-font: 'soramitsu-icons' !important;
 /*_____________________________________________Icons variables_____________________________________________*/
-$s-icon-activity: "\e902";
-$s-icon-arrow-bottom: "\e96f";
-$s-icon-arrow-bottom-left: "\e96d";
-$s-icon-arrow-bottom-right: "\e96e";
-$s-icon-arrow-bottom-rounded: "\e98b";
-$s-icon-arrow-left: "\e970";
-$s-icon-arrow-right: "\e971";
-$s-icon-arrow-top: "\e974";
-$s-icon-arrow-top-left: "\e972";
-$s-icon-arrow-top-right: "\e973";
-$s-icon-arrow-top-right-rounded: "\e98d";
-$s-icon-bar-chart: "\e903";
-$s-icon-book: "\e904";
-$s-icon-bookmark: "\e907";
-$s-icon-bookmark-add: "\e905";
-$s-icon-bookmark-no: "\e906";
-$s-icon-bookmarks: "\e908";
-$s-icon-box: "\e909";
-$s-icon-browser: "\e90b";
-$s-icon-browser-no: "\e90a";
-$s-icon-brush: "\e90c";
-$s-icon-build: "\e98e";
-$s-icon-calculator: "\e90d";
-$s-icon-calendar: "\e977";
-$s-icon-call-phone: "\e978";
-$s-icon-camera: "\e910";
-$s-icon-camera-create: "\e90e";
-$s-icon-camera-no: "\e90f";
-$s-icon-case: "\e911";
-$s-icon-change-positions: "\e98f";
-$s-icon-check-mark: "\e912";
-$s-icon-check-marks: "\e913";
-$s-icon-chevron-bottom: "\e97a";
-$s-icon-chevron-bottom-rounded: "\e992";
-$s-icon-chevron-left: "\e97b";
-$s-icon-chevron-left-rounded: "\e993";
-$s-icon-chevron-right: "\e97c";
-$s-icon-chevron-top: "\e97d";
-$s-icon-chevrons-bottom: "\e97e";
-$s-icon-chevrons-left: "\e97f";
-$s-icon-chevrons-right: "\e980";
-$s-icon-circle: "\e91d";
-$s-icon-circle-arrow-bottom: "\e981";
-$s-icon-circle-arrow-left: "\e982";
-$s-icon-circle-arrow-right: "\e983";
-$s-icon-circle-arrow-top: "\e984";
-$s-icon-circle-block: "\e914";
-$s-icon-circle-checked: "\e915";
-$s-icon-circle-chevron-bottom: "\e985";
-$s-icon-circle-chevron-left: "\e986";
-$s-icon-circle-chevron-right: "\e987";
-$s-icon-circle-chevron-top: "\e988";
-$s-icon-circle-chevrons-top: "\e989";
-$s-icon-circle-menu: "\e916";
-$s-icon-circle-minus: "\e917";
-$s-icon-circle-more-horizontal: "\e918";
-$s-icon-circle-more-vertical: "\e919";
-$s-icon-circle-plus: "\e91a";
-$s-icon-circle-star: "\e91b";
-$s-icon-circle-x: "\e91c";
-$s-icon-clear-style: "\e91e";
-$s-icon-copy: "\e91f";
-$s-icon-create: "\e979";
-$s-icon-cut: "\e920";
-$s-icon-dashboard: "\e921";
-$s-icon-delete: "\e922";
-$s-icon-download: "\e924";
-$s-icon-download-bold: "\e923";
-$s-icon-drop: "\e925";
-$s-icon-earn: "\e996";
-$s-icon-external-link: "\e926";
-$s-icon-eye: "\e928";
-$s-icon-eye-no: "\e927";
-$s-icon-file: "\e990";
-$s-icon-file-upload: "\e98a";
-$s-icon-flag: "\e929";
-$s-icon-flame: "\e92a";
-$s-icon-folder: "\e991";
-$s-icon-glasses: "\e92b";
-$s-icon-globe: "\e92d";
-$s-icon-globe-no: "\e92c";
-$s-icon-heart: "\e92f";
-$s-icon-heart-no: "\e92e";
-$s-icon-home: "\e930";
-$s-icon-image: "\e931";
-$s-icon-inbox: "\e932";
-$s-icon-info: "\e994";
-$s-icon-layers: "\e933";
-$s-icon-lightning: "\e935";
-$s-icon-lightning-no: "\e934";
-$s-icon-link: "\e937";
-$s-icon-link-no: "\e936";
-$s-icon-liquidity: "\e997";
-$s-icon-list: "\e938";
-$s-icon-lock: "\e995";
-$s-icon-logout: "\e98c";
-$s-icon-mail: "\e939";
-$s-icon-maximize: "\e93a";
-$s-icon-menu: "\e93c";
-$s-icon-menu-dots: "\e93b";
-$s-icon-mic: "\e93e";
-$s-icon-mic-no: "\e93d";
-$s-icon-minimize: "\e93f";
-$s-icon-minus: "\e940";
-$s-icon-minus-rounded: "\e998";
-$s-icon-moon: "\e99f";
-$s-icon-more-horizontal: "\e941";
-$s-icon-more-vertical: "\e942";
-$s-icon-newspaper: "\e943";
-$s-icon-options: "\e944";
-$s-icon-paperclip: "\e946";
-$s-icon-paperclip-no: "\e945";
-$s-icon-paperclip-vertical: "\e99a";
-$s-icon-pencil: "\e99c";
-$s-icon-pencil-create: "\e947";
-$s-icon-pencil-edit: "\e948";
-$s-icon-pin: "\e99d";
-$s-icon-play: "\e900";
-$s-icon-plus: "\e949";
-$s-icon-plus-rounded: "\e999";
-$s-icon-presentation: "\e94a";
-$s-icon-printer: "\e94b";
-$s-icon-pulse: "\e94c";
-$s-icon-question-circle: "\e9a0";
-$s-icon-refresh: "\e976";
-$s-icon-scan: "\e94d";
-$s-icon-screenshot: "\e94e";
-$s-icon-search: "\e94f";
-$s-icon-send: "\e950";
-$s-icon-settings: "\e951";
-$s-icon-share: "\e953";
-$s-icon-share-arrow: "\e952";
-$s-icon-star: "\e955";
-$s-icon-star-no: "\e954";
-$s-icon-sticker: "\e956";
-$s-icon-stop: "\e901";
-$s-icon-success: "\e975";
-$s-icon-swap: "\e99b";
-$s-icon-table: "\e957";
-$s-icon-target: "\e9a3";
-$s-icon-text-align-center: "\e958";
-$s-icon-text-align-justify: "\e959";
-$s-icon-text-align-left: "\e95a";
-$s-icon-text-align-right: "\e95b";
-$s-icon-text-bgcolor: "\e95c";
-$s-icon-text-bold: "\e95d";
-$s-icon-text-color: "\e95e";
-$s-icon-text-italic: "\e95f";
-$s-icon-text-underline: "\e960";
-$s-icon-thumbs-down: "\e961";
-$s-icon-thumbs-up: "\e962";
-$s-icon-time: "\e9a4";
-$s-icon-toggle-left: "\e963";
-$s-icon-toggle-right: "\e964";
-$s-icon-trash: "\e966";
-$s-icon-trash-empty: "\e965";
-$s-icon-user: "\e967";
-$s-icon-video: "\e969";
-$s-icon-video-no: "\e968";
-$s-icon-wallet: "\e9a1";
-$s-icon-warning: "\e96c";
-$s-icon-wi-fi: "\e9a5";
-$s-icon-x: "\e9a6";
-$s-icon-x-rounded: "\e99e";
-$s-icon-zoom-in: "\e96a";
-$s-icon-zoom-out: "\e96b";
+$s-icon-arrow-bottom-16: "\eb11";
+$s-icon-arrow-bottom-left-16: "\eb12";
+$s-icon-arrow-bottom-right-16: "\eb13";
+$s-icon-arrow-left-16: "\eb14";
+$s-icon-arrow-right-16: "\eb15";
+$s-icon-arrow-top-16: "\eb16";
+$s-icon-arrow-top-left-16: "\eb17";
+$s-icon-arrow-top-right-16: "\eb18";
+$s-icon-bookmark-16: "\eb19";
+$s-icon-browser-16: "\eb1a";
+$s-icon-calendar-16: "\eb1b";
+$s-icon-call-phone-16: "\eb1c";
+$s-icon-camera-16: "\eb1d";
+$s-icon-chevron-bottom-16: "\eb1e";
+$s-icon-chevron-down-rounded-16: "\eb1f";
+$s-icon-chevron-left-16: "\eb20";
+$s-icon-chevron-right-16: "\eb21";
+$s-icon-chevron-top-16: "\eb22";
+$s-icon-chevron-up-rounded-16: "\eb23";
+$s-icon-chevrons-bottom-16: "\eb24";
+$s-icon-chevrons-left-16: "\eb25";
+$s-icon-chevrons-right-16: "\eb26";
+$s-icon-circle-arrow-bottom-16: "\eb27";
+$s-icon-circle-arrow-left-16: "\eb28";
+$s-icon-circle-arrow-right-16: "\eb29";
+$s-icon-circle-arrow-top-16: "\eb2a";
+$s-icon-circle-chevron-bottom-16: "\eb2b";
+$s-icon-circle-chevron-left-16: "\eb2c";
+$s-icon-circle-chevron-right-16: "\eb2d";
+$s-icon-circle-chevron-top-16: "\eb2e";
+$s-icon-circle-chevrons-top-16: "\eb2f";
+$s-icon-circle-minus-16: "\eb30";
+$s-icon-circle-plus-16: "\eb31";
+$s-icon-circle-x-16: "\eb32";
+$s-icon-clear-X-16: "\eb33";
+$s-icon-clear-X-xs-16: "\eb34";
+$s-icon-copy-16: "\eb35";
+$s-icon-copy-thin-16: "\eb36";
+$s-icon-external-link-16: "\eb37";
+$s-icon-eye-16: "\eb38";
+$s-icon-file-16: "\eb39";
+$s-icon-folder-16: "\eb3a";
+$s-icon-globe-16: "\eb3b";
+$s-icon-heart-16: "\eb3c";
+$s-icon-refresh-16: "\eb3d";
+$s-icon-info-16: "\eb3e";
+$s-icon-lock-16: "\eb3f";
+$s-icon-mail-16: "\eb40";
+$s-icon-menu-16: "\eb41";
+$s-icon-minus-16: "\eb42";
+$s-icon-note-16: "\eb43";
+$s-icon-options-16: "\eb44";
+$s-icon-paperclip-16: "\eb45";
+$s-icon-paperclip-vertical-16: "\eb46";
+$s-icon-pencil-16: "\eb47";
+$s-icon-pin-16: "\eb48";
+$s-icon-plus-16: "\eb49";
+$s-icon-printer-16: "\eb4a";
+$s-icon-question-circle-16: "\eb4b";
+$s-icon-search-16: "\eb4c";
+$s-icon-star-16: "\eb4d";
+$s-icon-status-error-ic-16: "\eb4e";
+$s-icon-status-pending-ic-16: "\eb4f";
+$s-icon-status-success-ic-16: "\eb50";
+$s-icon-target-16: "\eb51";
+$s-icon-time-16: "\eb52";
+$s-icon-wi-fi-16: "\eb53";
+$s-icon-x-16: "\eb54";
+$s-icon-time-alarm-24: "\e920";
+$s-icon-time-alarm-checked-24: "\e921";
+$s-icon-time-alarm-minus-24: "\e922";
+$s-icon-time-alarm-no-24: "\e923";
+$s-icon-time-alarm-plus-24: "\e924";
+$s-icon-time-alarm-snooze-24: "\e925";
+$s-icon-time-calendar-24: "\e926";
+$s-icon-time-calendar-checked-24: "\e927";
+$s-icon-time-calendar-create-24: "\e928";
+$s-icon-time-calendar-dates-24: "\e929";
+$s-icon-time-calendar-delete-24: "\e92a";
+$s-icon-time-calendar-minus-24: "\e92b";
+$s-icon-time-calendar-plus-24: "\e92c";
+$s-icon-time-stopwatch-24: "\e92d";
+$s-icon-time-time-24: "\e92e";
+$s-icon-time-time-history-24: "\e92f";
+$s-icon-time-timer-24: "\e930";
+$s-icon-time-watch-24: "\e931";
+$s-icon-symbols-at-sign-24: "\e932";
+$s-icon-symbols-behance-24: "\e933";
+$s-icon-symbols-command-24: "\e934";
+$s-icon-symbols-dribbble-24: "\e935";
+$s-icon-symbols-facebook-24: "\e936";
+$s-icon-symbols-github-24: "\e937";
+$s-icon-symbols-gitlab-24: "\e938";
+$s-icon-symbols-google-24: "\e939";
+$s-icon-symbols-hash-24: "\e93a";
+$s-icon-symbols-instagram-24: "\e93b";
+$s-icon-symbols-linkedin-24: "\e93c";
+$s-icon-symbols-peace-24: "\e93d";
+$s-icon-symbols-telegram-24: "\e93e";
+$s-icon-symbols-twitter-24: "\e93f";
+$s-icon-symbols-youtube-24: "\e940";
+$s-icon-symbols-24: "\e941";
+$s-icon-symbols-0-24: "\e942";
+$s-icon-software-cloud-24: "\e943";
+$s-icon-software-cloud-checked-24: "\e944";
+$s-icon-software-cloud-connect-24: "\e945";
+$s-icon-software-cloud-download-24: "\e946";
+$s-icon-software-cloud-no-24: "\e947";
+$s-icon-software-cloud-upload-24: "\e948";
+$s-icon-software-code-24: "\e949";
+$s-icon-software-database-24: "\e94a";
+$s-icon-software-terminal-24: "\e94b";
+$s-icon-shopping-bag-24: "\e94c";
+$s-icon-shopping-bascket-24: "\e94d";
+$s-icon-shopping-cart-24: "\e94e";
+$s-icon-shopping-coupon-24: "\e94f";
+$s-icon-shopping-cut-coupon-24: "\e950";
+$s-icon-shopping-delivery-24: "\e951";
+$s-icon-shopping-discount-24: "\e952";
+$s-icon-shopping-filter-24: "\e953";
+$s-icon-shopping-gift-24: "\e954";
+$s-icon-shopping-pos-24: "\e955";
+$s-icon-shopping-tag-24: "\e956";
+$s-icon-shopping-tote-24: "\e957";
+$s-icon-maps-360-24: "\e958";
+$s-icon-maps-compas-24: "\e959";
+$s-icon-maps-direction-24: "\e95a";
+$s-icon-maps-direction-45-24: "\e95b";
+$s-icon-maps-globe-24: "\e95c";
+$s-icon-maps-location-24: "\e95d";
+$s-icon-maps-location-no-24: "\e95e";
+$s-icon-maps-map-24: "\e95f";
+$s-icon-maps-map-pin-location-24: "\e960";
+$s-icon-maps-panorama-24: "\e961";
+$s-icon-maps-pin-24: "\e962";
+$s-icon-maps-pin-add-24: "\e963";
+$s-icon-maps-pin-no-24: "\e964";
+$s-icon-maps-pin-question-24: "\e965";
+$s-icon-maps-pin-round-24: "\e966";
+$s-icon-maps-pin-start-24: "\e967";
+$s-icon-maps-radar-24: "\e968";
+$s-icon-maps-route-24: "\e969";
+$s-icon-music-add-to-library-24: "\e96a";
+$s-icon-music-artist-24: "\e96b";
+$s-icon-music-CD-24: "\e96c";
+$s-icon-music-eject-24: "\e96d";
+$s-icon-music-equalizer-24: "\e96e";
+$s-icon-music-listen-later-24: "\e96f";
+$s-icon-music-music-library-24: "\e970";
+$s-icon-music-music-note-24: "\e971";
+$s-icon-music-player-fast-back-24: "\e972";
+$s-icon-music-player-fast-forward-24: "\e973";
+$s-icon-music-player-list-24: "\e974";
+$s-icon-music-player-list-add-24: "\e975";
+$s-icon-music-player-list-play-24: "\e976";
+$s-icon-music-player-pause-24: "\e977";
+$s-icon-music-player-pause-circle-24: "\e978";
+$s-icon-music-player-play-24: "\e979";
+$s-icon-music-player-play-circle-24: "\e97a";
+$s-icon-music-player-play-pause-24: "\e97b";
+$s-icon-music-player-skip-back-24: "\e97c";
+$s-icon-music-player-skip-forward-24: "\e97d";
+$s-icon-music-player-stop-24: "\e97e";
+$s-icon-music-player-stop-circle-24: "\e97f";
+$s-icon-music-queue-24: "\e980";
+$s-icon-music-radio-24: "\e981";
+$s-icon-music-record-24: "\e982";
+$s-icon-music-repeat-24: "\e983";
+$s-icon-music-shuffle-24: "\e984";
+$s-icon-music-sound-wave-24: "\e985";
+$s-icon-music-tuner-24: "\e986";
+$s-icon-music-volume-24: "\e987";
+$s-icon-music-volume-high-24: "\e988";
+$s-icon-music-volume-low-24: "\e989";
+$s-icon-music-volume-no-24: "\e98a";
+$s-icon-music-volume-off-24: "\e98b";
+$s-icon-notifications-alert-circle-24: "\e98c";
+$s-icon-notifications-alert-octagon-24: "\e98d";
+$s-icon-notifications-alert-triangle-24: "\e98e";
+$s-icon-notifications-app-notification-24: "\e98f";
+$s-icon-notifications-bell-24: "\e990";
+$s-icon-notifications-bell-add-24: "\e991";
+$s-icon-notifications-bell-alert-24: "\e992";
+$s-icon-notifications-bell-checked-24: "\e993";
+$s-icon-notifications-bell-minus-24: "\e994";
+$s-icon-notifications-bell-no-24: "\e995";
+$s-icon-notifications-info-24: "\e996";
+$s-icon-notifications-minus-octagon-24: "\e997";
+$s-icon-notifications-question-circle-24: "\e998";
+$s-icon-notifications-x-octagon-24: "\e999";
+$s-icon-reactions-laughing-24: "\e99a";
+$s-icon-reactions-neutral-24: "\e99b";
+$s-icon-reactions-sad-24: "\e99c";
+$s-icon-reactions-shocked-24: "\e99d";
+$s-icon-reactions-smiled-24: "\e99e";
+$s-icon-security-face-ID-24: "\e99f";
+$s-icon-security-key-24: "\e9a0";
+$s-icon-security-key-no-24: "\e9a1";
+$s-icon-security-lock-24: "\e9a2";
+$s-icon-security-lock-circle-24: "\e9a3";
+$s-icon-security-lock-no-24: "\e9a4";
+$s-icon-security-logout-24: "\e9a5";
+$s-icon-security-shield-24: "\e9a6";
+$s-icon-security-shield-lock-24: "\e9a7";
+$s-icon-security-shield-no-24: "\e9a8";
+$s-icon-security-shield-ok-24: "\e9a9";
+$s-icon-security-unlock-24: "\e9aa";
+$s-icon-security-verified-24: "\e9ab";
+$s-icon-food-avocado-24: "\e9ac";
+$s-icon-food-bread-24: "\e9ad";
+$s-icon-food-chicken-24: "\e9ae";
+$s-icon-food-coffee-24: "\e9af";
+$s-icon-food-egg-24: "\e9b0";
+$s-icon-food-icecream-24: "\e9b1";
+$s-icon-gadgets-battery-20-24: "\e9b2";
+$s-icon-gadgets-battery-24: "\e9b3";
+$s-icon-gadgets-battery-40-24: "\e9b4";
+$s-icon-gadgets-battery-60-24: "\e9b5";
+$s-icon-gadgets-battery-80-24: "\e9b6";
+$s-icon-gadgets-battery-100-24: "\e9b7";
+$s-icon-gadgets-battery-charching-24: "\e9b8";
+$s-icon-gadgets-battery-no-24: "\e9b9";
+$s-icon-gadgets-devices-24: "\e9ba";
+$s-icon-gadgets-flash-card-24: "\e9bb";
+$s-icon-gadgets-floppy-24: "\e9bc";
+$s-icon-gadgets-iPad-24: "\e9bd";
+$s-icon-gadgets-iPhone-24: "\e9be";
+$s-icon-gadgets-laptop-24: "\e9bf";
+$s-icon-gadgets-memory-card-24: "\e9c0";
+$s-icon-gadgets-mobile-24: "\e9c1";
+$s-icon-gadgets-monitor-24: "\e9c2";
+$s-icon-gadgets-server-24: "\e9c3";
+$s-icon-grid-apps-24: "\eaea";
+$s-icon-grid-block-align-bottom-24: "\eaeb";
+$s-icon-grid-block-align-horizontally-24: "\eaec";
+$s-icon-grid-block-align-left-24: "\eaed";
+$s-icon-grid-block-align-right-24: "\eaee";
+$s-icon-grid-block-align-top-24: "\eaef";
+$s-icon-grid-block-align-vertically-24: "\eaf0";
+$s-icon-grid-block-distribute-horizontally-24: "\eaf1";
+$s-icon-grid-block-distribute-vertically-24: "\eaf2";
+$s-icon-grid-brake-page-24: "\eaf3";
+$s-icon-grid-edit-shape-24: "\eaf4";
+$s-icon-grid-elements-24: "\eaf5";
+$s-icon-grid-frame-24: "\eaf6";
+$s-icon-grid-grid-6-24: "\eaf7";
+$s-icon-grid-grid-24: "\eaf8";
+$s-icon-grid-grid-col-2-24: "\eaf9";
+$s-icon-grid-grid-col-3-24: "\eafa";
+$s-icon-grid-grid-dynamic-24: "\eafb";
+$s-icon-grid-grid-frame-24: "\eafc";
+$s-icon-grid-grid-row-2-copy-24: "\eafd";
+$s-icon-grid-grid-row-2-24: "\eafe";
+$s-icon-grid-grid-row-3-24: "\eaff";
+$s-icon-grid-grid-slides-24: "\eb00";
+$s-icon-grid-grid-small-24: "\eb01";
+$s-icon-grid-iframe-24: "\eb02";
+$s-icon-grid-kanban-24: "\eb03";
+$s-icon-grid-layout-24: "\eb04";
+$s-icon-grid-padding-24: "\eb05";
+$s-icon-grid-rotate-left-24: "\eb06";
+$s-icon-grid-rotate-right-24: "\eb07";
+$s-icon-grid-ruller-24: "\eb08";
+$s-icon-grid-segment-24: "\eb09";
+$s-icon-grid-select-24: "\eb0a";
+$s-icon-grid-select-area-24: "\eb0b";
+$s-icon-grid-sidebar-left-24: "\eb0c";
+$s-icon-grid-sidebar-right-24: "\eb0d";
+$s-icon-grid-stack-24-1: "\eb0e";
+$s-icon-grid-stack-24: "\eb0f";
+$s-icon-grid-text-24: "\eb10";
+$s-icon-arrows-arrow-bold-bottom-24: "\e9c4";
+$s-icon-arrows-arrow-bold-forvard-24: "\e9c5";
+$s-icon-arrows-arrow-bold-forvard-all-24: "\e9c6";
+$s-icon-arrows-arrow-bold-left-24: "\e9c7";
+$s-icon-arrows-arrow-bold-redo-24: "\e9c8";
+$s-icon-arrows-arrow-bold-reply-24: "\e9c9";
+$s-icon-arrows-arrow-bold-reply-all-24: "\e9ca";
+$s-icon-arrows-arrow-bold-right-24: "\e9cb";
+$s-icon-arrows-arrow-bold-top-24: "\e9cc";
+$s-icon-arrows-arrow-bold-undo-24: "\e9cd";
+$s-icon-arrows-arrow-bottom-24: "\e9ce";
+$s-icon-arrows-arrow-bottom-left-24: "\e9cf";
+$s-icon-arrows-arrow-bottom-right-24: "\e9d0";
+$s-icon-arrows-arrow-forward-24: "\e9d1";
+$s-icon-arrows-arrow-forward-all-24: "\e9d2";
+$s-icon-arrows-arrow-left-24: "\e9d3";
+$s-icon-arrows-arrow-left-curved-24: "\e9d4";
+$s-icon-arrows-arrow-redo-24: "\e9d5";
+$s-icon-arrows-arrow-reply-24: "\e9d6";
+$s-icon-arrows-arrow-reply-all-24: "\e9d7";
+$s-icon-arrows-arrow-right-24: "\e9d8";
+$s-icon-arrows-arrow-right-curved-24: "\e9d9";
+$s-icon-arrows-arrow-top-24: "\e9da";
+$s-icon-arrows-arrow-top-left-24: "\e9db";
+$s-icon-arrows-arrow-top-right-24: "\e9dc";
+$s-icon-arrows-arrow-top-right-small-24: "\e9dd";
+$s-icon-arrows-arrow-undo-24: "\e9de";
+$s-icon-arrows-arrows-diagonals-24: "\e9df";
+$s-icon-arrows-arrows-diagonals-bltr-24: "\e9e0";
+$s-icon-arrows-arrows-diagonals-tlbr-24: "\e9e1";
+$s-icon-arrows-arrows-hv-24: "\e9e2";
+$s-icon-arrows-chevron-bottom-24: "\e9e3";
+$s-icon-arrows-chevron-down-rounded-24: "\e9e4";
+$s-icon-arrows-chevron-left-24: "\e9e5";
+$s-icon-arrows-chevron-left-rounded-24: "\e9e6";
+$s-icon-arrows-chevron-left-xs-24: "\e9e7";
+$s-icon-arrows-chevron-right-24: "\e9e8";
+$s-icon-arrows-chevron-right-rounded-24: "\e9e9";
+$s-icon-arrows-chevron-right-xs-24: "\e9ea";
+$s-icon-arrows-chevron-top-24: "\e9eb";
+$s-icon-arrows-chevron-top-rounded-24: "\e9ec";
+$s-icon-arrows-chevrons-bottom-24: "\e9ed";
+$s-icon-arrows-chevrons-left-24: "\e9ee";
+$s-icon-arrows-chevrons-right-24: "\e9ef";
+$s-icon-arrows-chevrons-top-24: "\e9f0";
+$s-icon-arrows-circle-arrow-bottom-24: "\e9f1";
+$s-icon-arrows-circle-arrow-bottom-left-24: "\e9f2";
+$s-icon-arrows-circle-arrow-bottom-right-24: "\e9f3";
+$s-icon-arrows-circle-arrow-left-24: "\e9f4";
+$s-icon-arrows-circle-arrow-left-curved-24: "\e9f5";
+$s-icon-arrows-circle-arrow-right-24-1: "\e9f6";
+$s-icon-arrows-circle-arrow-right-24: "\e9f7";
+$s-icon-arrows-circle-arrow-right-curved-24: "\e9f8";
+$s-icon-arrows-circle-arrow-top-24: "\e9f9";
+$s-icon-arrows-circle-arrow-top-left-24: "\e9fa";
+$s-icon-arrows-circle-arrow-top-right-24: "\e9fb";
+$s-icon-arrows-circle-chevron-bottom-24: "\e9fc";
+$s-icon-arrows-circle-chevron-left-24: "\e9fd";
+$s-icon-arrows-circle-chevron-right-24: "\e9fe";
+$s-icon-arrows-circle-chevron-top-24: "\e9ff";
+$s-icon-arrows-circle-chevrons-bottom-24: "\ea00";
+$s-icon-arrows-circle-chevrons-left-24: "\ea01";
+$s-icon-arrows-circle-chevrons-right-24: "\ea02";
+$s-icon-arrows-circle-chevrons-top-24: "\ea03";
+$s-icon-arrows-refresh-ccw-24: "\ea04";
+$s-icon-arrows-refresh-ccw-alert-24: "\ea05";
+$s-icon-arrows-refresh-cw-24: "\ea06";
+$s-icon-arrows-refresh-cw-alert-24: "\ea07";
+$s-icon-arrows-rotate-ccw-24: "\ea08";
+$s-icon-arrows-rotate-cw-24: "\ea09";
+$s-icon-arrows-swap-24: "\ea0a";
+$s-icon-arrows-swap-90-24: "\ea0b";
+$s-icon-basic--24: "\ea0c";
+$s-icon-basic-bar-chart-24: "\ea0d";
+$s-icon-basic-book-24: "\ea0e";
+$s-icon-basic-bookmark-24: "\ea0f";
+$s-icon-basic-bookmark-add-24: "\ea10";
+$s-icon-basic-bookmark-no-24: "\ea11";
+$s-icon-basic-bookmarks-24: "\ea12";
+$s-icon-basic-box-24: "\ea13";
+$s-icon-basic-browser-24: "\ea14";
+$s-icon-basic-browser-no-24: "\ea15";
+$s-icon-basic-brush-24: "\ea16";
+$s-icon-basic-calculator-24: "\ea17";
+$s-icon-basic-camera-24: "\ea18";
+$s-icon-basic-camera-create-24: "\ea19";
+$s-icon-basic-camera-no-24: "\ea1a";
+$s-icon-basic-case-24: "\ea1b";
+$s-icon-basic-check-mark-24: "\ea1c";
+$s-icon-basic-check-marks-24: "\ea1d";
+$s-icon-basic-circle-24: "\ea1e";
+$s-icon-basic-circle-block-24: "\ea1f";
+$s-icon-basic-circle-checked-24: "\ea20";
+$s-icon-basic-circle-menu-24: "\ea21";
+$s-icon-basic-circle-minus-24: "\ea22";
+$s-icon-basic-circle-more-horizontal-24: "\ea23";
+$s-icon-basic-circle-more-vertical-24: "\ea24";
+$s-icon-basic-circle-plus-24: "\ea25";
+$s-icon-basic-circle-star-24: "\ea26";
+$s-icon-basic-circle-x-24: "\ea27";
+$s-icon-basic-clear-style-24: "\ea28";
+$s-icon-basic-clear-X-24: "\ea29";
+$s-icon-basic-clear-X-xs-24: "\ea2a";
+$s-icon-basic-close-24: "\ea2b";
+$s-icon-basic-copy-24: "\ea2c";
+$s-icon-basic-cut-24: "\ea2d";
+$s-icon-basic-dashboard-24: "\ea2e";
+$s-icon-basic-delete-24: "\ea2f";
+$s-icon-basic-download-24: "\ea30";
+$s-icon-basic-download-bold-24: "\ea31";
+$s-icon-basic-drop-24: "\ea32";
+$s-icon-basic-edit-24: "\ea33";
+$s-icon-basic-external-link-24: "\ea34";
+$s-icon-basic-eye-24: "\ea35";
+$s-icon-basic-eye-no-24: "\ea36";
+$s-icon-basic-filterlist-24: "\ea37";
+$s-icon-basic-flag-24: "\ea38";
+$s-icon-basic-flame-24: "\ea39";
+$s-icon-basic-glasses-24: "\ea3a";
+$s-icon-basic-globe-24: "\ea3b";
+$s-icon-basic-globe-no-24: "\ea3c";
+$s-icon-basic-heart-24: "\ea3d";
+$s-icon-basic-heart-no-24: "\ea3e";
+$s-icon-basic-home-24: "\ea3f";
+$s-icon-basic-image-24: "\ea40";
+$s-icon-basic-inbox-24: "\ea41";
+$s-icon-basic-layers-24: "\ea42";
+$s-icon-basic-lightning-24: "\ea43";
+$s-icon-basic-lightning-no-24: "\ea44";
+$s-icon-basic-link-24: "\ea45";
+$s-icon-basic-link-no-24: "\ea46";
+$s-icon-basic-list-24: "\ea47";
+$s-icon-basic-mail-24: "\ea48";
+$s-icon-basic-maximize-24: "\ea49";
+$s-icon-basic-menu-24: "\ea4a";
+$s-icon-basic-menu-dots-24: "\ea4b";
+$s-icon-basic-mic-24: "\ea4c";
+$s-icon-basic-mic-no-24: "\ea4d";
+$s-icon-basic-minimize-24: "\ea4e";
+$s-icon-basic-minus-24: "\ea4f";
+$s-icon-basic-more-horizontal-24: "\ea50";
+$s-icon-basic-more-vertical-24: "\ea51";
+$s-icon-basic-newspaper-24: "\ea52";
+$s-icon-basic-options-3-24: "\ea53";
+$s-icon-basic-options-24: "\ea54";
+$s-icon-basic-paperclip-24: "\ea55";
+$s-icon-basic-paperclip-no-24: "\ea56";
+$s-icon-basic-pencil-create-24: "\ea57";
+$s-icon-basic-pencil-edit-24: "\ea58";
+$s-icon-basic-photo-pic-24: "\ea59";
+$s-icon-basic-placeholder-24: "\ea5a";
+$s-icon-basic-plus-24: "\ea5b";
+$s-icon-basic-presentation-24: "\ea5c";
+$s-icon-basic-printer-24: "\ea5d";
+$s-icon-basic-pulse-24: "\ea5e";
+$s-icon-basic-receive-24: "\ea5f";
+$s-icon-basic-scan-24: "\ea60";
+$s-icon-basic-scan-custom-24: "\ea61";
+$s-icon-basic-screenshot-24: "\ea62";
+$s-icon-basic-search-24: "\ea63";
+$s-icon-basic-send-24-1: "\ea64";
+$s-icon-basic-send-24: "\ea65";
+$s-icon-basic-settings-24: "\ea66";
+$s-icon-basic-share-24: "\ea67";
+$s-icon-basic-share-arrow-24: "\ea68";
+$s-icon-basic-star-24: "\ea69";
+$s-icon-basic-star-no-24: "\ea6a";
+$s-icon-basic-sticker-24: "\ea6b";
+$s-icon-basic-table-24: "\ea6c";
+$s-icon-basic-text-align-center-24: "\ea6d";
+$s-icon-basic-text-align-justify-24: "\ea6e";
+$s-icon-basic-text-align-left-24: "\ea6f";
+$s-icon-basic-text-align-right-24: "\ea70";
+$s-icon-basic-text-bgcolor-24: "\ea71";
+$s-icon-basic-text-bold-24: "\ea72";
+$s-icon-basic-text-color-24: "\ea73";
+$s-icon-basic-text-italic-24: "\ea74";
+$s-icon-basic-text-underline-24: "\ea75";
+$s-icon-basic-thumbs-down-24: "\ea76";
+$s-icon-basic-thumbs-up-24: "\ea77";
+$s-icon-basic-toggle-left-24: "\ea78";
+$s-icon-basic-toggle-right-24: "\ea79";
+$s-icon-basic-trash-24: "\ea7a";
+$s-icon-basic-trash-empty-24: "\ea7b";
+$s-icon-basic-user-24: "\ea7c";
+$s-icon-basic-video-24: "\ea7d";
+$s-icon-basic-video-no-24: "\ea7e";
+$s-icon-basic-zoom-in-24: "\ea7f";
+$s-icon-basic-zoom-out-24: "\ea80";
+$s-icon-call-call-add-24: "\ea81";
+$s-icon-call-call-calling-24: "\ea82";
+$s-icon-call-call-decline-24: "\ea83";
+$s-icon-call-call-end-24: "\ea84";
+$s-icon-call-call-forwarded-24: "\ea85";
+$s-icon-call-call-hash-24: "\ea86";
+$s-icon-call-call-hold-24: "\ea87";
+$s-icon-call-call-incoming-24: "\ea88";
+$s-icon-call-call-missed-24: "\ea89";
+$s-icon-call-call-muted-24: "\ea8a";
+$s-icon-call-call-no-24: "\ea8b";
+$s-icon-call-call-numbers-24: "\ea8c";
+$s-icon-call-call-outcoming-24: "\ea8d";
+$s-icon-call-call-phone-24: "\ea8e";
+$s-icon-call-call-recieved-24: "\ea8f";
+$s-icon-call-call-voicemail-24: "\ea90";
+$s-icon-chatting-comment-24: "\ea91";
+$s-icon-chatting-comment-checked-24: "\ea92";
+$s-icon-chatting-comment-delete-24: "\ea93";
+$s-icon-chatting-comment-minus-24: "\ea94";
+$s-icon-chatting-comment-plus-24: "\ea95";
+$s-icon-chatting-comment-text-24: "\ea96";
+$s-icon-chatting-question-24: "\ea97";
+$s-icon-connection-airplay-24: "\ea98";
+$s-icon-connection-bluetooth-24: "\ea99";
+$s-icon-connection-bluetooth-no-24: "\ea9a";
+$s-icon-connection-broadcast-24: "\ea9b";
+$s-icon-connection-broadcasting-24: "\ea9c";
+$s-icon-connection-cast-24: "\ea9d";
+$s-icon-connection-wi-fi-24: "\ea9e";
+$s-icon-connection-wi-fi-no-24: "\ea9f";
+$s-icon-file-clipboard-24: "\eaa0";
+$s-icon-file-clipboard-checked-24: "\eaa1";
+$s-icon-file-clipboard-delete-24: "\eaa2";
+$s-icon-file-clipboard-minus-24: "\eaa3";
+$s-icon-file-clipboard-plus-24: "\eaa4";
+$s-icon-file-clipboard-text-24: "\eaa5";
+$s-icon-file-file-24: "\eaa6";
+$s-icon-file-file-checked-24: "\eaa7";
+$s-icon-file-file-code-24: "\eaa8";
+$s-icon-file-file-create-24: "\eaa9";
+$s-icon-file-file-delete-24: "\eaaa";
+$s-icon-file-file-download-24: "\eaab";
+$s-icon-file-file-draft-24: "\eaac";
+$s-icon-file-file-minus-24: "\eaad";
+$s-icon-file-file-plus-24: "\eaae";
+$s-icon-file-file-scan-24: "\eaaf";
+$s-icon-file-file-shredder-24: "\eab0";
+$s-icon-file-file-text-24: "\eab1";
+$s-icon-file-file-upload-24: "\eab2";
+$s-icon-file-folder-24: "\eab3";
+$s-icon-file-folder-arrow-24: "\eab4";
+$s-icon-file-folder-checked-24: "\eab5";
+$s-icon-file-folder-cloud-24: "\eab6";
+$s-icon-file-folder-create-24: "\eab7";
+$s-icon-file-folder-delete-24: "\eab8";
+$s-icon-file-folder-minus-24: "\eab9";
+$s-icon-file-folder-music-24: "\eaba";
+$s-icon-file-folder-opened-24: "\eabb";
+$s-icon-file-folder-photo-24: "\eabc";
+$s-icon-file-folder-plus-24: "\eabd";
+$s-icon-file-folder-zip-24: "\eabe";
+$s-icon-file-note-24: "\eabf";
+$s-icon-file-note-text-24: "\eac0";
+$s-icon-finance-account-balance-24: "\eac1";
+$s-icon-finance-bitcoin-24: "\eac2";
+$s-icon-finance-control-point-duplicate-deposit-24: "\eac3";
+$s-icon-finance-creditcard-24: "\eac4";
+$s-icon-finance-creditcard-add-24: "\eac5";
+$s-icon-finance-creditcard-face-24: "\eac6";
+$s-icon-finance-creditcard-income-24: "\eac7";
+$s-icon-finance-creditcard-no-24: "\eac8";
+$s-icon-finance-creditcard-outcome-24: "\eac9";
+$s-icon-finance-creditcard-scan-24: "\eaca";
+$s-icon-finance-ethereum-dontuse-24: "\eacb";
+$s-icon-finance-liquidity-24: "\eacc";
+$s-icon-finance-paypass-24: "\eacd";
+$s-icon-finance-PSWAP-24: "\eace";
+$s-icon-finance-receive-show-QR-24: "\eacf";
+$s-icon-finance-receive-24: "\ead0";
+$s-icon-finance-send-24: "\ead1";
+$s-icon-finance-strongbox-24: "\ead2";
+$s-icon-finance-VALerc20-outline-24: "\ead3";
+$s-icon-finance-wallet-24: "\ead4";
+$s-icon-finance-XOR-outline-24: "\ead5";
+$s-icon-various-advertisement-24: "\ead6";
+$s-icon-various-atom-24: "\ead7";
+$s-icon-various-bone-24: "\ead8";
+$s-icon-various-brightness-high-24: "\ead9";
+$s-icon-various-brightness-low-24: "\eada";
+$s-icon-various-contrast-24: "\eadb";
+$s-icon-various-cross-24: "\eadc";
+$s-icon-various-crosshairs-24: "\eadd";
+$s-icon-various-cup-24: "\eade";
+$s-icon-various-form-24: "\eadf";
+$s-icon-various-infinity-24: "\eae0";
+$s-icon-various-items-24: "\eae1";
+$s-icon-various-lightbulb-24: "\eae2";
+$s-icon-various-moon-24: "\eae3";
+$s-icon-various-nut-24: "\eae4";
+$s-icon-various-planet-24: "\eae5";
+$s-icon-various-pocket-24: "\eae6";
+$s-icon-various-rocket-24: "\eae7";
+$s-icon-various-sun-24: "\eae8";
+$s-icon-various-toy-horse-24: "\eae9";
 /*_____________________________________________Icons classes_____________________________________________*/
-.s-icon-activity {
+.s-icon-arrow-bottom-16 {
   &:before {
-    content: $s-icon-activity;
+    content: $s-icon-arrow-bottom-16;
   }
 }
-.s-icon-arrow-bottom {
+.s-icon-arrow-bottom-left-16 {
   &:before {
-    content: $s-icon-arrow-bottom;
+    content: $s-icon-arrow-bottom-left-16;
   }
 }
-.s-icon-arrow-bottom-left {
+.s-icon-arrow-bottom-right-16 {
   &:before {
-    content: $s-icon-arrow-bottom-left;
+    content: $s-icon-arrow-bottom-right-16;
   }
 }
-.s-icon-arrow-bottom-right {
+.s-icon-arrow-left-16 {
   &:before {
-    content: $s-icon-arrow-bottom-right;
+    content: $s-icon-arrow-left-16;
   }
 }
-.s-icon-arrow-bottom-rounded {
+.s-icon-arrow-right-16 {
   &:before {
-    content: $s-icon-arrow-bottom-rounded;
+    content: $s-icon-arrow-right-16;
   }
 }
-.s-icon-arrow-left, .s-icon-back {
+.s-icon-arrow-top-16 {
   &:before {
-    content: $s-icon-arrow-left;
+    content: $s-icon-arrow-top-16;
   }
 }
-.s-icon-arrow-right {
+.s-icon-arrow-top-left-16 {
   &:before {
-    content: $s-icon-arrow-right;
+    content: $s-icon-arrow-top-left-16;
   }
 }
-.s-icon-arrow-top {
+.s-icon-arrow-top-right-16 {
   &:before {
-    content: $s-icon-arrow-top;
+    content: $s-icon-arrow-top-right-16;
   }
 }
-.s-icon-arrow-top-left {
+.s-icon-bookmark-16 {
   &:before {
-    content: $s-icon-arrow-top-left;
+    content: $s-icon-bookmark-16;
   }
 }
-.s-icon-arrow-top-right {
+.s-icon-browser-16 {
   &:before {
-    content: $s-icon-arrow-top-right;
+    content: $s-icon-browser-16;
   }
 }
-.s-icon-arrow-top-right-rounded {
+.s-icon-calendar-16 {
   &:before {
-    content: $s-icon-arrow-top-right-rounded;
+    content: $s-icon-calendar-16;
   }
 }
-.s-icon-bar-chart {
+.s-icon-call-phone-16 {
   &:before {
-    content: $s-icon-bar-chart;
+    content: $s-icon-call-phone-16;
   }
 }
-.s-icon-book {
+.s-icon-camera-16 {
   &:before {
-    content: $s-icon-book;
+    content: $s-icon-camera-16;
   }
 }
-.s-icon-bookmark {
+.s-icon-chevron-bottom-16 {
   &:before {
-    content: $s-icon-bookmark;
+    content: $s-icon-chevron-bottom-16;
   }
 }
-.s-icon-bookmark-add {
+.s-icon-chevron-down-rounded-16 {
   &:before {
-    content: $s-icon-bookmark-add;
+    content: $s-icon-chevron-down-rounded-16;
   }
 }
-.s-icon-bookmark-no {
+.s-icon-chevron-left-16 {
   &:before {
-    content: $s-icon-bookmark-no;
+    content: $s-icon-chevron-left-16;
   }
 }
-.s-icon-bookmarks {
+.s-icon-chevron-right-16 {
   &:before {
-    content: $s-icon-bookmarks;
+    content: $s-icon-chevron-right-16;
   }
 }
-.s-icon-box {
+.s-icon-chevron-top-16 {
   &:before {
-    content: $s-icon-box;
+    content: $s-icon-chevron-top-16;
   }
 }
-.s-icon-browser {
+.s-icon-chevron-up-rounded-16 {
   &:before {
-    content: $s-icon-browser;
+    content: $s-icon-chevron-up-rounded-16;
   }
 }
-.s-icon-browser-no {
+.s-icon-chevrons-bottom-16 {
   &:before {
-    content: $s-icon-browser-no;
+    content: $s-icon-chevrons-bottom-16;
   }
 }
-.s-icon-brush {
+.s-icon-chevrons-left-16 {
   &:before {
-    content: $s-icon-brush;
+    content: $s-icon-chevrons-left-16;
   }
 }
-.s-icon-build {
+.s-icon-chevrons-right-16 {
   &:before {
-    content: $s-icon-build;
+    content: $s-icon-chevrons-right-16;
   }
 }
-.s-icon-calculator {
+.s-icon-circle-arrow-bottom-16 {
   &:before {
-    content: $s-icon-calculator;
+    content: $s-icon-circle-arrow-bottom-16;
   }
 }
-.s-icon-calendar {
+.s-icon-circle-arrow-left-16 {
   &:before {
-    content: $s-icon-calendar;
+    content: $s-icon-circle-arrow-left-16;
   }
 }
-.s-icon-call-phone {
+.s-icon-circle-arrow-right-16 {
   &:before {
-    content: $s-icon-call-phone;
+    content: $s-icon-circle-arrow-right-16;
   }
 }
-.s-icon-camera {
+.s-icon-circle-arrow-top-16 {
   &:before {
-    content: $s-icon-camera;
+    content: $s-icon-circle-arrow-top-16;
   }
 }
-.s-icon-camera-create {
+.s-icon-circle-chevron-bottom-16 {
   &:before {
-    content: $s-icon-camera-create;
+    content: $s-icon-circle-chevron-bottom-16;
   }
 }
-.s-icon-camera-no {
+.s-icon-circle-chevron-left-16 {
   &:before {
-    content: $s-icon-camera-no;
+    content: $s-icon-circle-chevron-left-16;
   }
 }
-.s-icon-case {
+.s-icon-circle-chevron-right-16 {
   &:before {
-    content: $s-icon-case;
+    content: $s-icon-circle-chevron-right-16;
   }
 }
-.s-icon-change-positions {
+.s-icon-circle-chevron-top-16 {
   &:before {
-    content: $s-icon-change-positions;
+    content: $s-icon-circle-chevron-top-16;
   }
 }
-.s-icon-check-mark {
+.s-icon-circle-chevrons-top-16 {
   &:before {
-    content: $s-icon-check-mark;
+    content: $s-icon-circle-chevrons-top-16;
   }
 }
-.s-icon-check-marks {
+.s-icon-circle-minus-16 {
   &:before {
-    content: $s-icon-check-marks;
+    content: $s-icon-circle-minus-16;
   }
 }
-.s-icon-chevron-bottom {
+.s-icon-circle-plus-16 {
   &:before {
-    content: $s-icon-chevron-bottom;
+    content: $s-icon-circle-plus-16;
   }
 }
-.s-icon-chevron-bottom-rounded {
+.s-icon-circle-x-16 {
   &:before {
-    content: $s-icon-chevron-bottom-rounded;
+    content: $s-icon-circle-x-16;
   }
 }
-.s-icon-chevron-left {
+.s-icon-clear-X-16 {
   &:before {
-    content: $s-icon-chevron-left;
+    content: $s-icon-clear-X-16;    
+    color: #a3a4a8;
   }
 }
-.s-icon-chevron-left-rounded {
+.s-icon-clear-X-xs-16 {
   &:before {
-    content: $s-icon-chevron-left-rounded;
+    content: $s-icon-clear-X-xs-16;    
+    color: #a3a4a8;
   }
 }
-.s-icon-chevron-right {
+.s-icon-copy-16 {
   &:before {
-    content: $s-icon-chevron-right;
+    content: $s-icon-copy-16;
   }
 }
-.s-icon-chevron-top {
+.s-icon-copy-thin-16 {
   &:before {
-    content: $s-icon-chevron-top;
+    content: $s-icon-copy-thin-16;
   }
 }
-.s-icon-chevrons-bottom {
+.s-icon-external-link-16 {
   &:before {
-    content: $s-icon-chevrons-bottom;
+    content: $s-icon-external-link-16;
   }
 }
-.s-icon-chevrons-left {
+.s-icon-eye-16 {
   &:before {
-    content: $s-icon-chevrons-left;
+    content: $s-icon-eye-16;
   }
 }
-.s-icon-chevrons-right {
+.s-icon-file-16 {
   &:before {
-    content: $s-icon-chevrons-right;
+    content: $s-icon-file-16;
   }
 }
-.s-icon-circle {
+.s-icon-folder-16 {
   &:before {
-    content: $s-icon-circle;
+    content: $s-icon-folder-16;
   }
 }
-.s-icon-circle-arrow-bottom {
+.s-icon-globe-16 {
   &:before {
-    content: $s-icon-circle-arrow-bottom;
+    content: $s-icon-globe-16;
   }
 }
-.s-icon-circle-arrow-left {
+.s-icon-heart-16 {
   &:before {
-    content: $s-icon-circle-arrow-left;
+    content: $s-icon-heart-16;
   }
 }
-.s-icon-circle-arrow-right {
+.s-icon-refresh-16 {
   &:before {
-    content: $s-icon-circle-arrow-right;
+    content: $s-icon-refresh-16;
   }
 }
-.s-icon-circle-arrow-top {
+.s-icon-info-16 {
   &:before {
-    content: $s-icon-circle-arrow-top;
+    content: $s-icon-info-16;
   }
 }
-.s-icon-circle-block {
+.s-icon-lock-16 {
   &:before {
-    content: $s-icon-circle-block;
+    content: $s-icon-lock-16;
   }
 }
-.s-icon-circle-checked {
+.s-icon-mail-16 {
   &:before {
-    content: $s-icon-circle-checked;
+    content: $s-icon-mail-16;
   }
 }
-.s-icon-circle-chevron-bottom {
+.s-icon-menu-16 {
   &:before {
-    content: $s-icon-circle-chevron-bottom;
+    content: $s-icon-menu-16;
   }
 }
-.s-icon-circle-chevron-left {
+.s-icon-minus-16 {
   &:before {
-    content: $s-icon-circle-chevron-left;
+    content: $s-icon-minus-16;
   }
 }
-.s-icon-circle-chevron-right {
+.s-icon-note-16 {
   &:before {
-    content: $s-icon-circle-chevron-right;
+    content: $s-icon-note-16;
   }
 }
-.s-icon-circle-chevron-top {
+.s-icon-options-16 {
   &:before {
-    content: $s-icon-circle-chevron-top;
+    content: $s-icon-options-16;
   }
 }
-.s-icon-circle-chevrons-top {
+.s-icon-paperclip-16 {
   &:before {
-    content: $s-icon-circle-chevrons-top;
+    content: $s-icon-paperclip-16;
   }
 }
-.s-icon-circle-menu {
+.s-icon-paperclip-vertical-16 {
   &:before {
-    content: $s-icon-circle-menu;
+    content: $s-icon-paperclip-vertical-16;
   }
 }
-.s-icon-circle-minus {
+.s-icon-pencil-16 {
   &:before {
-    content: $s-icon-circle-minus;
+    content: $s-icon-pencil-16;
   }
 }
-.s-icon-circle-more-horizontal {
+.s-icon-pin-16 {
   &:before {
-    content: $s-icon-circle-more-horizontal;
+    content: $s-icon-pin-16;
   }
 }
-.s-icon-circle-more-vertical {
+.s-icon-plus-16 {
   &:before {
-    content: $s-icon-circle-more-vertical;
+    content: $s-icon-plus-16;
   }
 }
-.s-icon-circle-plus {
+.s-icon-printer-16 {
   &:before {
-    content: $s-icon-circle-plus;
+    content: $s-icon-printer-16;
   }
 }
-.s-icon-circle-star {
+.s-icon-question-circle-16 {
   &:before {
-    content: $s-icon-circle-star;
+    content: $s-icon-question-circle-16;
   }
 }
-.s-icon-circle-x {
+.s-icon-search-16 {
   &:before {
-    content: $s-icon-circle-x;
+    content: $s-icon-search-16;
   }
 }
-.s-icon-clear-style {
+.s-icon-star-16 {
   &:before {
-    content: $s-icon-clear-style;
+    content: $s-icon-star-16;
   }
 }
-.s-icon-copy {
+.s-icon-status-error-ic-16, .s-icon-status-error {
   &:before {
-    content: $s-icon-copy;
+    content: $s-icon-status-error-ic-16;
   }
 }
-.s-icon-create {
+.s-icon-status-pending-ic-16, .s-icon-status-pending {
   &:before {
-    content: $s-icon-create;
+    content: $s-icon-status-pending-ic-16;
   }
 }
-.s-icon-cut {
+.s-icon-status-success-ic-16, .s-icon-status-success {
   &:before {
-    content: $s-icon-cut;
+    content: $s-icon-status-success-ic-16;
   }
 }
-.s-icon-dashboard {
+.s-icon-target-16 {
   &:before {
-    content: $s-icon-dashboard;
+    content: $s-icon-target-16;
   }
 }
-.s-icon-delete {
+.s-icon-time-16 {
   &:before {
-    content: $s-icon-delete;
+    content: $s-icon-time-16;
   }
 }
-.s-icon-download {
+.s-icon-wi-fi-16 {
   &:before {
-    content: $s-icon-download;
+    content: $s-icon-wi-fi-16;
   }
 }
-.s-icon-download-bold {
+.s-icon-x-16 {
   &:before {
-    content: $s-icon-download-bold;
+    content: $s-icon-x-16;
   }
 }
-.s-icon-drop {
+.s-icon-time-alarm-24 {
   &:before {
-    content: $s-icon-drop;
+    content: $s-icon-time-alarm-24;
   }
 }
-.s-icon-earn {
+.s-icon-time-alarm-checked-24 {
   &:before {
-    content: $s-icon-earn;
+    content: $s-icon-time-alarm-checked-24;
   }
 }
-.s-icon-external-link {
+.s-icon-time-alarm-minus-24 {
   &:before {
-    content: $s-icon-external-link;
+    content: $s-icon-time-alarm-minus-24;
   }
 }
-.s-icon-eye {
+.s-icon-time-alarm-no-24 {
   &:before {
-    content: $s-icon-eye;
+    content: $s-icon-time-alarm-no-24;
   }
 }
-.s-icon-eye-no {
+.s-icon-time-alarm-plus-24 {
   &:before {
-    content: $s-icon-eye-no;
+    content: $s-icon-time-alarm-plus-24;
   }
 }
-.s-icon-file {
+.s-icon-time-alarm-snooze-24 {
   &:before {
-    content: $s-icon-file;
+    content: $s-icon-time-alarm-snooze-24;
   }
 }
-.s-icon-file-upload {
+.s-icon-time-calendar-24 {
   &:before {
-    content: $s-icon-file-upload;
+    content: $s-icon-time-calendar-24;
   }
 }
-.s-icon-flag {
+.s-icon-time-calendar-checked-24 {
   &:before {
-    content: $s-icon-flag;
+    content: $s-icon-time-calendar-checked-24;
   }
 }
-.s-icon-flame {
+.s-icon-time-calendar-create-24 {
   &:before {
-    content: $s-icon-flame;
+    content: $s-icon-time-calendar-create-24;
   }
 }
-.s-icon-folder {
+.s-icon-time-calendar-dates-24 {
   &:before {
-    content: $s-icon-folder;
+    content: $s-icon-time-calendar-dates-24;
   }
 }
-.s-icon-glasses {
+.s-icon-time-calendar-delete-24 {
   &:before {
-    content: $s-icon-glasses;
+    content: $s-icon-time-calendar-delete-24;
   }
 }
-.s-icon-globe {
+.s-icon-time-calendar-minus-24 {
   &:before {
-    content: $s-icon-globe;
+    content: $s-icon-time-calendar-minus-24;
   }
 }
-.s-icon-globe-no {
+.s-icon-time-calendar-plus-24 {
   &:before {
-    content: $s-icon-globe-no;
+    content: $s-icon-time-calendar-plus-24;
   }
 }
-.s-icon-heart {
+.s-icon-time-stopwatch-24 {
   &:before {
-    content: $s-icon-heart;
+    content: $s-icon-time-stopwatch-24;
   }
 }
-.s-icon-heart-no {
+.s-icon-time-time-24 {
   &:before {
-    content: $s-icon-heart-no;
+    content: $s-icon-time-time-24;
   }
 }
-.s-icon-home {
+.s-icon-time-time-history-24 {
   &:before {
-    content: $s-icon-home;
+    content: $s-icon-time-time-history-24;
   }
 }
-.s-icon-image {
+.s-icon-time-timer-24 {
   &:before {
-    content: $s-icon-image;
+    content: $s-icon-time-timer-24;
   }
 }
-.s-icon-inbox {
+.s-icon-time-watch-24 {
   &:before {
-    content: $s-icon-inbox;
+    content: $s-icon-time-watch-24;
   }
 }
-.s-icon-info {
+.s-icon-symbols-at-sign-24 {
   &:before {
-    content: $s-icon-info;
+    content: $s-icon-symbols-at-sign-24;
   }
 }
-.s-icon-layers {
+.s-icon-symbols-behance-24 {
   &:before {
-    content: $s-icon-layers;
+    content: $s-icon-symbols-behance-24;
   }
 }
-.s-icon-lightning {
+.s-icon-symbols-command-24 {
   &:before {
-    content: $s-icon-lightning;
+    content: $s-icon-symbols-command-24;
   }
 }
-.s-icon-lightning-no {
+.s-icon-symbols-dribbble-24 {
   &:before {
-    content: $s-icon-lightning-no;
+    content: $s-icon-symbols-dribbble-24;
   }
 }
-.s-icon-link {
+.s-icon-symbols-facebook-24 {
   &:before {
-    content: $s-icon-link;
+    content: $s-icon-symbols-facebook-24;
   }
 }
-.s-icon-link-no {
+.s-icon-symbols-github-24 {
   &:before {
-    content: $s-icon-link-no;
+    content: $s-icon-symbols-github-24;
   }
 }
-.s-icon-liquidity {
+.s-icon-symbols-gitlab-24 {
   &:before {
-    content: $s-icon-liquidity;
+    content: $s-icon-symbols-gitlab-24;
   }
 }
-.s-icon-list {
+.s-icon-symbols-google-24 {
   &:before {
-    content: $s-icon-list;
+    content: $s-icon-symbols-google-24;
   }
 }
-.s-icon-lock {
+.s-icon-symbols-hash-24 {
   &:before {
-    content: $s-icon-lock;
+    content: $s-icon-symbols-hash-24;
   }
 }
-.s-icon-logout {
+.s-icon-symbols-instagram-24 {
   &:before {
-    content: $s-icon-logout;
+    content: $s-icon-symbols-instagram-24;
   }
 }
-.s-icon-mail {
+.s-icon-symbols-linkedin-24 {
   &:before {
-    content: $s-icon-mail;
+    content: $s-icon-symbols-linkedin-24;
   }
 }
-.s-icon-maximize {
+.s-icon-symbols-peace-24 {
   &:before {
-    content: $s-icon-maximize;
+    content: $s-icon-symbols-peace-24;
   }
 }
-.s-icon-menu {
+.s-icon-symbols-telegram-24 {
   &:before {
-    content: $s-icon-menu;
+    content: $s-icon-symbols-telegram-24;
   }
 }
-.s-icon-menu-dots {
+.s-icon-symbols-twitter-24 {
   &:before {
-    content: $s-icon-menu-dots;
+    content: $s-icon-symbols-twitter-24;
   }
 }
-.s-icon-mic {
+.s-icon-symbols-youtube-24 {
   &:before {
-    content: $s-icon-mic;
+    content: $s-icon-symbols-youtube-24;
   }
 }
-.s-icon-mic-no {
+.s-icon-symbols-24 {
   &:before {
-    content: $s-icon-mic-no;
+    content: $s-icon-symbols-24;
   }
 }
-.s-icon-minimize {
+.s-icon-symbols-0-24 {
   &:before {
-    content: $s-icon-minimize;
+    content: $s-icon-symbols-0-24;
   }
 }
-.s-icon-minus {
+.s-icon-software-cloud-24 {
   &:before {
-    content: $s-icon-minus;
+    content: $s-icon-software-cloud-24;
   }
 }
-.s-icon-minus-rounded {
+.s-icon-software-cloud-checked-24 {
   &:before {
-    content: $s-icon-minus-rounded;
+    content: $s-icon-software-cloud-checked-24;
   }
 }
-.s-icon-moon {
+.s-icon-software-cloud-connect-24 {
   &:before {
-    content: $s-icon-moon;
+    content: $s-icon-software-cloud-connect-24;
   }
 }
-.s-icon-more-horizontal {
+.s-icon-software-cloud-download-24 {
   &:before {
-    content: $s-icon-more-horizontal;
+    content: $s-icon-software-cloud-download-24;
   }
 }
-.s-icon-more-vertical {
+.s-icon-software-cloud-no-24 {
   &:before {
-    content: $s-icon-more-vertical;
+    content: $s-icon-software-cloud-no-24;
   }
 }
-.s-icon-newspaper {
+.s-icon-software-cloud-upload-24 {
   &:before {
-    content: $s-icon-newspaper;
+    content: $s-icon-software-cloud-upload-24;
   }
 }
-.s-icon-options {
+.s-icon-software-code-24 {
   &:before {
-    content: $s-icon-options;
+    content: $s-icon-software-code-24;
   }
 }
-.s-icon-paperclip {
+.s-icon-software-database-24 {
   &:before {
-    content: $s-icon-paperclip;
+    content: $s-icon-software-database-24;
   }
 }
-.s-icon-paperclip-no {
+.s-icon-software-terminal-24 {
   &:before {
-    content: $s-icon-paperclip-no;
+    content: $s-icon-software-terminal-24;
   }
 }
-.s-icon-paperclip-vertical {
+.s-icon-shopping-bag-24 {
   &:before {
-    content: $s-icon-paperclip-vertical;
+    content: $s-icon-shopping-bag-24;
   }
 }
-.s-icon-pencil {
+.s-icon-shopping-bascket-24 {
   &:before {
-    content: $s-icon-pencil;
+    content: $s-icon-shopping-bascket-24;
   }
 }
-.s-icon-pencil-create {
+.s-icon-shopping-cart-24 {
   &:before {
-    content: $s-icon-pencil-create;
+    content: $s-icon-shopping-cart-24;
   }
 }
-.s-icon-pencil-edit {
+.s-icon-shopping-coupon-24 {
   &:before {
-    content: $s-icon-pencil-edit;
+    content: $s-icon-shopping-coupon-24;
   }
 }
-.s-icon-pin {
+.s-icon-shopping-cut-coupon-24 {
   &:before {
-    content: $s-icon-pin;
+    content: $s-icon-shopping-cut-coupon-24;
   }
 }
-.s-icon-play {
+.s-icon-shopping-delivery-24 {
   &:before {
-    content: $s-icon-play;
+    content: $s-icon-shopping-delivery-24;
   }
 }
-.s-icon-plus {
+.s-icon-shopping-discount-24 {
   &:before {
-    content: $s-icon-plus;
+    content: $s-icon-shopping-discount-24;
   }
 }
-.s-icon-plus-rounded {
+.s-icon-shopping-filter-24 {
   &:before {
-    content: $s-icon-plus-rounded;
+    content: $s-icon-shopping-filter-24;
   }
 }
-.s-icon-presentation {
+.s-icon-shopping-gift-24 {
   &:before {
-    content: $s-icon-presentation;
+    content: $s-icon-shopping-gift-24;
   }
 }
-.s-icon-printer {
+.s-icon-shopping-pos-24 {
   &:before {
-    content: $s-icon-printer;
+    content: $s-icon-shopping-pos-24;
   }
 }
-.s-icon-pulse {
+.s-icon-shopping-tag-24 {
   &:before {
-    content: $s-icon-pulse;
+    content: $s-icon-shopping-tag-24;
   }
 }
-.s-icon-question-circle {
+.s-icon-shopping-tote-24 {
   &:before {
-    content: $s-icon-question-circle;
+    content: $s-icon-shopping-tote-24;
   }
 }
-.s-icon-refresh {
+.s-icon-maps-360-24 {
   &:before {
-    content: $s-icon-refresh;
+    content: $s-icon-maps-360-24;
   }
 }
-.s-icon-scan {
+.s-icon-maps-compas-24 {
   &:before {
-    content: $s-icon-scan;
+    content: $s-icon-maps-compas-24;
   }
 }
-.s-icon-screenshot {
+.s-icon-maps-direction-24 {
   &:before {
-    content: $s-icon-screenshot;
+    content: $s-icon-maps-direction-24;
   }
 }
-.s-icon-search {
+.s-icon-maps-direction-45-24 {
   &:before {
-    content: $s-icon-search;
+    content: $s-icon-maps-direction-45-24;
   }
 }
-.s-icon-send {
+.s-icon-maps-globe-24 {
   &:before {
-    content: $s-icon-send;
+    content: $s-icon-maps-globe-24;
   }
 }
-.s-icon-settings {
+.s-icon-maps-location-24 {
   &:before {
-    content: $s-icon-settings;
+    content: $s-icon-maps-location-24;
   }
 }
-.s-icon-share {
+.s-icon-maps-location-no-24 {
   &:before {
-    content: $s-icon-share;
+    content: $s-icon-maps-location-no-24;
   }
 }
-.s-icon-share-arrow {
+.s-icon-maps-map-24 {
   &:before {
-    content: $s-icon-share-arrow;
+    content: $s-icon-maps-map-24;
   }
 }
-.s-icon-star {
+.s-icon-maps-map-pin-location-24 {
   &:before {
-    content: $s-icon-star;
+    content: $s-icon-maps-map-pin-location-24;
   }
 }
-.s-icon-star-no {
+.s-icon-maps-panorama-24 {
   &:before {
-    content: $s-icon-star-no;
+    content: $s-icon-maps-panorama-24;
   }
 }
-.s-icon-sticker {
+.s-icon-maps-pin-24 {
   &:before {
-    content: $s-icon-sticker;
+    content: $s-icon-maps-pin-24;
   }
 }
-.s-icon-stop {
+.s-icon-maps-pin-add-24 {
   &:before {
-    content: $s-icon-stop;
+    content: $s-icon-maps-pin-add-24;
   }
 }
-.s-icon-success {
+.s-icon-maps-pin-no-24 {
   &:before {
-    content: $s-icon-success;
+    content: $s-icon-maps-pin-no-24;
   }
 }
-.s-icon-swap {
+.s-icon-maps-pin-question-24 {
   &:before {
-    content: $s-icon-swap;
+    content: $s-icon-maps-pin-question-24;
   }
 }
-.s-icon-table {
+.s-icon-maps-pin-round-24 {
   &:before {
-    content: $s-icon-table;
+    content: $s-icon-maps-pin-round-24;
   }
 }
-.s-icon-target {
+.s-icon-maps-pin-start-24 {
   &:before {
-    content: $s-icon-target;
+    content: $s-icon-maps-pin-start-24;
   }
 }
-.s-icon-text-align-center {
+.s-icon-maps-radar-24 {
   &:before {
-    content: $s-icon-text-align-center;
+    content: $s-icon-maps-radar-24;
   }
 }
-.s-icon-text-align-justify {
+.s-icon-maps-route-24 {
   &:before {
-    content: $s-icon-text-align-justify;
+    content: $s-icon-maps-route-24;
   }
 }
-.s-icon-text-align-left {
+.s-icon-music-add-to-library-24 {
   &:before {
-    content: $s-icon-text-align-left;
+    content: $s-icon-music-add-to-library-24;
   }
 }
-.s-icon-text-align-right {
+.s-icon-music-artist-24 {
   &:before {
-    content: $s-icon-text-align-right;
+    content: $s-icon-music-artist-24;
   }
 }
-.s-icon-text-bgcolor {
+.s-icon-music-CD-24 {
   &:before {
-    content: $s-icon-text-bgcolor;
+    content: $s-icon-music-CD-24;
   }
 }
-.s-icon-text-bold {
+.s-icon-music-eject-24 {
   &:before {
-    content: $s-icon-text-bold;
+    content: $s-icon-music-eject-24;
   }
 }
-.s-icon-text-color {
+.s-icon-music-equalizer-24 {
   &:before {
-    content: $s-icon-text-color;
+    content: $s-icon-music-equalizer-24;
   }
 }
-.s-icon-text-italic {
+.s-icon-music-listen-later-24 {
   &:before {
-    content: $s-icon-text-italic;
+    content: $s-icon-music-listen-later-24;
   }
 }
-.s-icon-text-underline {
+.s-icon-music-music-library-24 {
   &:before {
-    content: $s-icon-text-underline;
+    content: $s-icon-music-music-library-24;
   }
 }
-.s-icon-thumbs-down {
+.s-icon-music-music-note-24 {
   &:before {
-    content: $s-icon-thumbs-down;
+    content: $s-icon-music-music-note-24;
   }
 }
-.s-icon-thumbs-up {
+.s-icon-music-player-fast-back-24 {
   &:before {
-    content: $s-icon-thumbs-up;
+    content: $s-icon-music-player-fast-back-24;
   }
 }
-.s-icon-time {
+.s-icon-music-player-fast-forward-24 {
   &:before {
-    content: $s-icon-time;
+    content: $s-icon-music-player-fast-forward-24;
   }
 }
-.s-icon-toggle-left {
+.s-icon-music-player-list-24 {
   &:before {
-    content: $s-icon-toggle-left;
+    content: $s-icon-music-player-list-24;
   }
 }
-.s-icon-toggle-right {
+.s-icon-music-player-list-add-24 {
   &:before {
-    content: $s-icon-toggle-right;
+    content: $s-icon-music-player-list-add-24;
   }
 }
-.s-icon-trash {
+.s-icon-music-player-list-play-24 {
   &:before {
-    content: $s-icon-trash;
+    content: $s-icon-music-player-list-play-24;
   }
 }
-.s-icon-trash-empty {
+.s-icon-music-player-pause-24 {
   &:before {
-    content: $s-icon-trash-empty;
+    content: $s-icon-music-player-pause-24;
   }
 }
-.s-icon-user {
+.s-icon-music-player-pause-circle-24 {
   &:before {
-    content: $s-icon-user;
+    content: $s-icon-music-player-pause-circle-24;
   }
 }
-.s-icon-video {
+.s-icon-music-player-play-24 {
   &:before {
-    content: $s-icon-video;
+    content: $s-icon-music-player-play-24;
   }
 }
-.s-icon-video-no {
+.s-icon-music-player-play-circle-24 {
   &:before {
-    content: $s-icon-video-no;
+    content: $s-icon-music-player-play-circle-24;
   }
 }
-.s-icon-wallet {
+.s-icon-music-player-play-pause-24 {
   &:before {
-    content: $s-icon-wallet;
+    content: $s-icon-music-player-play-pause-24;
   }
 }
-.s-icon-warning, .s-icon-error {
+.s-icon-music-player-skip-back-24 {
   &:before {
-    content: $s-icon-warning;
+    content: $s-icon-music-player-skip-back-24;
   }
 }
-.s-icon-wi-fi {
+.s-icon-music-player-skip-forward-24 {
   &:before {
-    content: $s-icon-wi-fi;
+    content: $s-icon-music-player-skip-forward-24;
   }
 }
-.s-icon-x {
+.s-icon-music-player-stop-24 {
   &:before {
-    content: $s-icon-x;
+    content: $s-icon-music-player-stop-24;
   }
 }
-.s-icon-x-rounded {
+.s-icon-music-player-stop-circle-24 {
   &:before {
-    content: $s-icon-x-rounded;
+    content: $s-icon-music-player-stop-circle-24;
   }
 }
-.s-icon-zoom-in {
+.s-icon-music-queue-24 {
   &:before {
-    content: $s-icon-zoom-in;
+    content: $s-icon-music-queue-24;
   }
 }
-.s-icon-zoom-out {
+.s-icon-music-radio-24 {
   &:before {
-    content: $s-icon-zoom-out;
+    content: $s-icon-music-radio-24;
+  }
+}
+.s-icon-music-record-24 {
+  &:before {
+    content: $s-icon-music-record-24;
+  }
+}
+.s-icon-music-repeat-24 {
+  &:before {
+    content: $s-icon-music-repeat-24;
+  }
+}
+.s-icon-music-shuffle-24 {
+  &:before {
+    content: $s-icon-music-shuffle-24;
+  }
+}
+.s-icon-music-sound-wave-24 {
+  &:before {
+    content: $s-icon-music-sound-wave-24;
+  }
+}
+.s-icon-music-tuner-24 {
+  &:before {
+    content: $s-icon-music-tuner-24;
+  }
+}
+.s-icon-music-volume-24 {
+  &:before {
+    content: $s-icon-music-volume-24;
+  }
+}
+.s-icon-music-volume-high-24 {
+  &:before {
+    content: $s-icon-music-volume-high-24;
+  }
+}
+.s-icon-music-volume-low-24 {
+  &:before {
+    content: $s-icon-music-volume-low-24;
+  }
+}
+.s-icon-music-volume-no-24 {
+  &:before {
+    content: $s-icon-music-volume-no-24;
+  }
+}
+.s-icon-music-volume-off-24 {
+  &:before {
+    content: $s-icon-music-volume-off-24;
+  }
+}
+.s-icon-notifications-alert-circle-24 {
+  &:before {
+    content: $s-icon-notifications-alert-circle-24;
+  }
+}
+.s-icon-notifications-alert-octagon-24 {
+  &:before {
+    content: $s-icon-notifications-alert-octagon-24;
+  }
+}
+.s-icon-notifications-alert-triangle-24 {
+  &:before {
+    content: $s-icon-notifications-alert-triangle-24;
+  }
+}
+.s-icon-notifications-app-notification-24 {
+  &:before {
+    content: $s-icon-notifications-app-notification-24;
+  }
+}
+.s-icon-notifications-bell-24 {
+  &:before {
+    content: $s-icon-notifications-bell-24;
+  }
+}
+.s-icon-notifications-bell-add-24 {
+  &:before {
+    content: $s-icon-notifications-bell-add-24;
+  }
+}
+.s-icon-notifications-bell-alert-24 {
+  &:before {
+    content: $s-icon-notifications-bell-alert-24;
+  }
+}
+.s-icon-notifications-bell-checked-24 {
+  &:before {
+    content: $s-icon-notifications-bell-checked-24;
+  }
+}
+.s-icon-notifications-bell-minus-24 {
+  &:before {
+    content: $s-icon-notifications-bell-minus-24;
+  }
+}
+.s-icon-notifications-bell-no-24 {
+  &:before {
+    content: $s-icon-notifications-bell-no-24;
+  }
+}
+.s-icon-notifications-info-24 {
+  &:before {
+    content: $s-icon-notifications-info-24;
+  }
+}
+.s-icon-notifications-minus-octagon-24 {
+  &:before {
+    content: $s-icon-notifications-minus-octagon-24;
+  }
+}
+.s-icon-notifications-question-circle-24 {
+  &:before {
+    content: $s-icon-notifications-question-circle-24;
+  }
+}
+.s-icon-notifications-x-octagon-24 {
+  &:before {
+    content: $s-icon-notifications-x-octagon-24;
+  }
+}
+.s-icon-reactions-laughing-24 {
+  &:before {
+    content: $s-icon-reactions-laughing-24;
+  }
+}
+.s-icon-reactions-neutral-24 {
+  &:before {
+    content: $s-icon-reactions-neutral-24;
+  }
+}
+.s-icon-reactions-sad-24 {
+  &:before {
+    content: $s-icon-reactions-sad-24;
+  }
+}
+.s-icon-reactions-shocked-24 {
+  &:before {
+    content: $s-icon-reactions-shocked-24;
+  }
+}
+.s-icon-reactions-smiled-24 {
+  &:before {
+    content: $s-icon-reactions-smiled-24;
+  }
+}
+.s-icon-security-face-ID-24 {
+  &:before {
+    content: $s-icon-security-face-ID-24;
+  }
+}
+.s-icon-security-key-24 {
+  &:before {
+    content: $s-icon-security-key-24;
+  }
+}
+.s-icon-security-key-no-24 {
+  &:before {
+    content: $s-icon-security-key-no-24;
+  }
+}
+.s-icon-security-lock-24 {
+  &:before {
+    content: $s-icon-security-lock-24;
+  }
+}
+.s-icon-security-lock-circle-24 {
+  &:before {
+    content: $s-icon-security-lock-circle-24;
+  }
+}
+.s-icon-security-lock-no-24 {
+  &:before {
+    content: $s-icon-security-lock-no-24;
+  }
+}
+.s-icon-security-logout-24 {
+  &:before {
+    content: $s-icon-security-logout-24;
+  }
+}
+.s-icon-security-shield-24 {
+  &:before {
+    content: $s-icon-security-shield-24;
+  }
+}
+.s-icon-security-shield-lock-24 {
+  &:before {
+    content: $s-icon-security-shield-lock-24;
+  }
+}
+.s-icon-security-shield-no-24 {
+  &:before {
+    content: $s-icon-security-shield-no-24;
+  }
+}
+.s-icon-security-shield-ok-24 {
+  &:before {
+    content: $s-icon-security-shield-ok-24;
+  }
+}
+.s-icon-security-unlock-24 {
+  &:before {
+    content: $s-icon-security-unlock-24;
+  }
+}
+.s-icon-security-verified-24 {
+  &:before {
+    content: $s-icon-security-verified-24;
+  }
+}
+.s-icon-food-avocado-24 {
+  &:before {
+    content: $s-icon-food-avocado-24;
+  }
+}
+.s-icon-food-bread-24 {
+  &:before {
+    content: $s-icon-food-bread-24;
+  }
+}
+.s-icon-food-chicken-24 {
+  &:before {
+    content: $s-icon-food-chicken-24;
+  }
+}
+.s-icon-food-coffee-24 {
+  &:before {
+    content: $s-icon-food-coffee-24;
+  }
+}
+.s-icon-food-egg-24 {
+  &:before {
+    content: $s-icon-food-egg-24;
+  }
+}
+.s-icon-food-icecream-24 {
+  &:before {
+    content: $s-icon-food-icecream-24;
+  }
+}
+.s-icon-gadgets-battery-20-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-20-24;
+  }
+}
+.s-icon-gadgets-battery-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-24;
+  }
+}
+.s-icon-gadgets-battery-40-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-40-24;
+  }
+}
+.s-icon-gadgets-battery-60-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-60-24;
+  }
+}
+.s-icon-gadgets-battery-80-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-80-24;
+  }
+}
+.s-icon-gadgets-battery-100-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-100-24;
+  }
+}
+.s-icon-gadgets-battery-charching-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-charching-24;
+  }
+}
+.s-icon-gadgets-battery-no-24 {
+  &:before {
+    content: $s-icon-gadgets-battery-no-24;
+  }
+}
+.s-icon-gadgets-devices-24 {
+  &:before {
+    content: $s-icon-gadgets-devices-24;
+  }
+}
+.s-icon-gadgets-flash-card-24 {
+  &:before {
+    content: $s-icon-gadgets-flash-card-24;
+  }
+}
+.s-icon-gadgets-floppy-24 {
+  &:before {
+    content: $s-icon-gadgets-floppy-24;
+  }
+}
+.s-icon-gadgets-iPad-24 {
+  &:before {
+    content: $s-icon-gadgets-iPad-24;
+  }
+}
+.s-icon-gadgets-iPhone-24 {
+  &:before {
+    content: $s-icon-gadgets-iPhone-24;
+  }
+}
+.s-icon-gadgets-laptop-24 {
+  &:before {
+    content: $s-icon-gadgets-laptop-24;
+  }
+}
+.s-icon-gadgets-memory-card-24 {
+  &:before {
+    content: $s-icon-gadgets-memory-card-24;
+  }
+}
+.s-icon-gadgets-mobile-24 {
+  &:before {
+    content: $s-icon-gadgets-mobile-24;
+  }
+}
+.s-icon-gadgets-monitor-24 {
+  &:before {
+    content: $s-icon-gadgets-monitor-24;
+  }
+}
+.s-icon-gadgets-server-24 {
+  &:before {
+    content: $s-icon-gadgets-server-24;
+  }
+}
+.s-icon-grid-apps-24 {
+  &:before {
+    content: $s-icon-grid-apps-24;
+  }
+}
+.s-icon-grid-block-align-bottom-24 {
+  &:before {
+    content: $s-icon-grid-block-align-bottom-24;
+  }
+}
+.s-icon-grid-block-align-horizontally-24 {
+  &:before {
+    content: $s-icon-grid-block-align-horizontally-24;
+  }
+}
+.s-icon-grid-block-align-left-24 {
+  &:before {
+    content: $s-icon-grid-block-align-left-24;
+  }
+}
+.s-icon-grid-block-align-right-24 {
+  &:before {
+    content: $s-icon-grid-block-align-right-24;
+  }
+}
+.s-icon-grid-block-align-top-24 {
+  &:before {
+    content: $s-icon-grid-block-align-top-24;
+  }
+}
+.s-icon-grid-block-align-vertically-24 {
+  &:before {
+    content: $s-icon-grid-block-align-vertically-24;
+  }
+}
+.s-icon-grid-block-distribute-horizontally-24 {
+  &:before {
+    content: $s-icon-grid-block-distribute-horizontally-24;
+  }
+}
+.s-icon-grid-block-distribute-vertically-24 {
+  &:before {
+    content: $s-icon-grid-block-distribute-vertically-24;
+  }
+}
+.s-icon-grid-brake-page-24 {
+  &:before {
+    content: $s-icon-grid-brake-page-24;
+  }
+}
+.s-icon-grid-edit-shape-24 {
+  &:before {
+    content: $s-icon-grid-edit-shape-24;
+  }
+}
+.s-icon-grid-elements-24 {
+  &:before {
+    content: $s-icon-grid-elements-24;
+  }
+}
+.s-icon-grid-frame-24 {
+  &:before {
+    content: $s-icon-grid-frame-24;
+  }
+}
+.s-icon-grid-grid-6-24 {
+  &:before {
+    content: $s-icon-grid-grid-6-24;
+  }
+}
+.s-icon-grid-grid-24 {
+  &:before {
+    content: $s-icon-grid-grid-24;
+  }
+}
+.s-icon-grid-grid-col-2-24 {
+  &:before {
+    content: $s-icon-grid-grid-col-2-24;
+  }
+}
+.s-icon-grid-grid-col-3-24 {
+  &:before {
+    content: $s-icon-grid-grid-col-3-24;
+  }
+}
+.s-icon-grid-grid-dynamic-24 {
+  &:before {
+    content: $s-icon-grid-grid-dynamic-24;
+  }
+}
+.s-icon-grid-grid-frame-24 {
+  &:before {
+    content: $s-icon-grid-grid-frame-24;
+  }
+}
+.s-icon-grid-grid-row-2-copy-24 {
+  &:before {
+    content: $s-icon-grid-grid-row-2-copy-24;
+  }
+}
+.s-icon-grid-grid-row-2-24 {
+  &:before {
+    content: $s-icon-grid-grid-row-2-24;
+  }
+}
+.s-icon-grid-grid-row-3-24 {
+  &:before {
+    content: $s-icon-grid-grid-row-3-24;
+  }
+}
+.s-icon-grid-grid-slides-24 {
+  &:before {
+    content: $s-icon-grid-grid-slides-24;
+  }
+}
+.s-icon-grid-grid-small-24 {
+  &:before {
+    content: $s-icon-grid-grid-small-24;
+  }
+}
+.s-icon-grid-iframe-24 {
+  &:before {
+    content: $s-icon-grid-iframe-24;
+  }
+}
+.s-icon-grid-kanban-24 {
+  &:before {
+    content: $s-icon-grid-kanban-24;
+  }
+}
+.s-icon-grid-layout-24 {
+  &:before {
+    content: $s-icon-grid-layout-24;
+  }
+}
+.s-icon-grid-padding-24 {
+  &:before {
+    content: $s-icon-grid-padding-24;
+  }
+}
+.s-icon-grid-rotate-left-24 {
+  &:before {
+    content: $s-icon-grid-rotate-left-24;
+  }
+}
+.s-icon-grid-rotate-right-24 {
+  &:before {
+    content: $s-icon-grid-rotate-right-24;
+  }
+}
+.s-icon-grid-ruller-24 {
+  &:before {
+    content: $s-icon-grid-ruller-24;
+  }
+}
+.s-icon-grid-segment-24 {
+  &:before {
+    content: $s-icon-grid-segment-24;
+  }
+}
+.s-icon-grid-select-24 {
+  &:before {
+    content: $s-icon-grid-select-24;
+  }
+}
+.s-icon-grid-select-area-24 {
+  &:before {
+    content: $s-icon-grid-select-area-24;
+  }
+}
+.s-icon-grid-sidebar-left-24 {
+  &:before {
+    content: $s-icon-grid-sidebar-left-24;
+  }
+}
+.s-icon-grid-sidebar-right-24 {
+  &:before {
+    content: $s-icon-grid-sidebar-right-24;
+  }
+}
+.s-icon-grid-stack-24-1 {
+  &:before {
+    content: $s-icon-grid-stack-24-1;
+  }
+}
+.s-icon-grid-stack-24 {
+  &:before {
+    content: $s-icon-grid-stack-24;
+  }
+}
+.s-icon-grid-text-24 {
+  &:before {
+    content: $s-icon-grid-text-24;
+  }
+}
+.s-icon-arrows-arrow-bold-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-bottom-24;
+  }
+}
+.s-icon-arrows-arrow-bold-forvard-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-forvard-24;
+  }
+}
+.s-icon-arrows-arrow-bold-forvard-all-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-forvard-all-24;
+  }
+}
+.s-icon-arrows-arrow-bold-left-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-left-24;
+  }
+}
+.s-icon-arrows-arrow-bold-redo-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-redo-24;
+  }
+}
+.s-icon-arrows-arrow-bold-reply-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-reply-24;
+  }
+}
+.s-icon-arrows-arrow-bold-reply-all-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-reply-all-24;
+  }
+}
+.s-icon-arrows-arrow-bold-right-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-right-24;
+  }
+}
+.s-icon-arrows-arrow-bold-top-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-top-24;
+  }
+}
+.s-icon-arrows-arrow-bold-undo-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bold-undo-24;
+  }
+}
+.s-icon-arrows-arrow-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bottom-24;
+  }
+}
+.s-icon-arrows-arrow-bottom-left-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bottom-left-24;
+  }
+}
+.s-icon-arrows-arrow-bottom-right-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-bottom-right-24;
+  }
+}
+.s-icon-arrows-arrow-forward-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-forward-24;
+  }
+}
+.s-icon-arrows-arrow-forward-all-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-forward-all-24;
+  }
+}
+.s-icon-arrows-arrow-left-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-left-24;
+  }
+}
+.s-icon-arrows-arrow-left-curved-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-left-curved-24;
+  }
+}
+.s-icon-arrows-arrow-redo-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-redo-24;
+  }
+}
+.s-icon-arrows-arrow-reply-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-reply-24;
+  }
+}
+.s-icon-arrows-arrow-reply-all-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-reply-all-24;
+  }
+}
+.s-icon-arrows-arrow-right-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-right-24;
+  }
+}
+.s-icon-arrows-arrow-right-curved-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-right-curved-24;
+  }
+}
+.s-icon-arrows-arrow-top-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-top-24;
+  }
+}
+.s-icon-arrows-arrow-top-left-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-top-left-24;
+  }
+}
+.s-icon-arrows-arrow-top-right-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-top-right-24;
+  }
+}
+.s-icon-arrows-arrow-top-right-small-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-top-right-small-24;
+  }
+}
+.s-icon-arrows-arrow-undo-24 {
+  &:before {
+    content: $s-icon-arrows-arrow-undo-24;
+  }
+}
+.s-icon-arrows-arrows-diagonals-24 {
+  &:before {
+    content: $s-icon-arrows-arrows-diagonals-24;
+  }
+}
+.s-icon-arrows-arrows-diagonals-bltr-24 {
+  &:before {
+    content: $s-icon-arrows-arrows-diagonals-bltr-24;
+  }
+}
+.s-icon-arrows-arrows-diagonals-tlbr-24 {
+  &:before {
+    content: $s-icon-arrows-arrows-diagonals-tlbr-24;
+  }
+}
+.s-icon-arrows-arrows-hv-24 {
+  &:before {
+    content: $s-icon-arrows-arrows-hv-24;
+  }
+}
+.s-icon-arrows-chevron-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-bottom-24;
+  }
+}
+.s-icon-arrows-chevron-down-rounded-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-down-rounded-24;
+  }
+}
+.s-icon-arrows-chevron-left-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-left-24;
+  }
+}
+.s-icon-arrows-chevron-left-rounded-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-left-rounded-24;
+  }
+}
+.s-icon-arrows-chevron-left-xs-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-left-xs-24;
+  }
+}
+.s-icon-arrows-chevron-right-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-right-24;
+  }
+}
+.s-icon-arrows-chevron-right-rounded-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-right-rounded-24;
+  }
+}
+.s-icon-arrows-chevron-right-xs-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-right-xs-24;
+  }
+}
+.s-icon-arrows-chevron-top-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-top-24;
+  }
+}
+.s-icon-arrows-chevron-top-rounded-24 {
+  &:before {
+    content: $s-icon-arrows-chevron-top-rounded-24;
+  }
+}
+.s-icon-arrows-chevrons-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-chevrons-bottom-24;
+  }
+}
+.s-icon-arrows-chevrons-left-24 {
+  &:before {
+    content: $s-icon-arrows-chevrons-left-24;
+  }
+}
+.s-icon-arrows-chevrons-right-24 {
+  &:before {
+    content: $s-icon-arrows-chevrons-right-24;
+  }
+}
+.s-icon-arrows-chevrons-top-24 {
+  &:before {
+    content: $s-icon-arrows-chevrons-top-24;
+  }
+}
+.s-icon-arrows-circle-arrow-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-bottom-24;
+  }
+}
+.s-icon-arrows-circle-arrow-bottom-left-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-bottom-left-24;
+  }
+}
+.s-icon-arrows-circle-arrow-bottom-right-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-bottom-right-24;
+  }
+}
+.s-icon-arrows-circle-arrow-left-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-left-24;
+  }
+}
+.s-icon-arrows-circle-arrow-left-curved-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-left-curved-24;
+  }
+}
+.s-icon-arrows-circle-arrow-right-24-1 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-right-24-1;
+  }
+}
+.s-icon-arrows-circle-arrow-right-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-right-24;
+  }
+}
+.s-icon-arrows-circle-arrow-right-curved-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-right-curved-24;
+  }
+}
+.s-icon-arrows-circle-arrow-top-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-top-24;
+  }
+}
+.s-icon-arrows-circle-arrow-top-left-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-top-left-24;
+  }
+}
+.s-icon-arrows-circle-arrow-top-right-24 {
+  &:before {
+    content: $s-icon-arrows-circle-arrow-top-right-24;
+  }
+}
+.s-icon-arrows-circle-chevron-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevron-bottom-24;
+  }
+}
+.s-icon-arrows-circle-chevron-left-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevron-left-24;
+  }
+}
+.s-icon-arrows-circle-chevron-right-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevron-right-24;
+  }
+}
+.s-icon-arrows-circle-chevron-top-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevron-top-24;
+  }
+}
+.s-icon-arrows-circle-chevrons-bottom-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevrons-bottom-24;
+  }
+}
+.s-icon-arrows-circle-chevrons-left-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevrons-left-24;
+  }
+}
+.s-icon-arrows-circle-chevrons-right-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevrons-right-24;
+  }
+}
+.s-icon-arrows-circle-chevrons-top-24 {
+  &:before {
+    content: $s-icon-arrows-circle-chevrons-top-24;
+  }
+}
+.s-icon-arrows-refresh-ccw-24 {
+  &:before {
+    content: $s-icon-arrows-refresh-ccw-24;
+  }
+}
+.s-icon-arrows-refresh-ccw-alert-24 {
+  &:before {
+    content: $s-icon-arrows-refresh-ccw-alert-24;
+  }
+}
+.s-icon-arrows-refresh-cw-24 {
+  &:before {
+    content: $s-icon-arrows-refresh-cw-24;
+  }
+}
+.s-icon-arrows-refresh-cw-alert-24 {
+  &:before {
+    content: $s-icon-arrows-refresh-cw-alert-24;
+  }
+}
+.s-icon-arrows-rotate-ccw-24 {
+  &:before {
+    content: $s-icon-arrows-rotate-ccw-24;
+  }
+}
+.s-icon-arrows-rotate-cw-24 {
+  &:before {
+    content: $s-icon-arrows-rotate-cw-24;
+  }
+}
+.s-icon-arrows-swap-24 {
+  &:before {
+    content: $s-icon-arrows-swap-24;
+  }
+}
+.s-icon-arrows-swap-90-24 {
+  &:before {
+    content: $s-icon-arrows-swap-90-24;
+  }
+}
+.s-icon-basic--24 {
+  &:before {
+    content: $s-icon-basic--24;
+  }
+}
+.s-icon-basic-bar-chart-24 {
+  &:before {
+    content: $s-icon-basic-bar-chart-24;
+  }
+}
+.s-icon-basic-book-24 {
+  &:before {
+    content: $s-icon-basic-book-24;
+  }
+}
+.s-icon-basic-bookmark-24 {
+  &:before {
+    content: $s-icon-basic-bookmark-24;
+  }
+}
+.s-icon-basic-bookmark-add-24 {
+  &:before {
+    content: $s-icon-basic-bookmark-add-24;
+  }
+}
+.s-icon-basic-bookmark-no-24 {
+  &:before {
+    content: $s-icon-basic-bookmark-no-24;
+  }
+}
+.s-icon-basic-bookmarks-24 {
+  &:before {
+    content: $s-icon-basic-bookmarks-24;
+  }
+}
+.s-icon-basic-box-24 {
+  &:before {
+    content: $s-icon-basic-box-24;
+  }
+}
+.s-icon-basic-browser-24 {
+  &:before {
+    content: $s-icon-basic-browser-24;
+  }
+}
+.s-icon-basic-browser-no-24 {
+  &:before {
+    content: $s-icon-basic-browser-no-24;
+  }
+}
+.s-icon-basic-brush-24 {
+  &:before {
+    content: $s-icon-basic-brush-24;
+  }
+}
+.s-icon-basic-calculator-24 {
+  &:before {
+    content: $s-icon-basic-calculator-24;
+  }
+}
+.s-icon-basic-camera-24 {
+  &:before {
+    content: $s-icon-basic-camera-24;
+  }
+}
+.s-icon-basic-camera-create-24 {
+  &:before {
+    content: $s-icon-basic-camera-create-24;
+  }
+}
+.s-icon-basic-camera-no-24 {
+  &:before {
+    content: $s-icon-basic-camera-no-24;
+  }
+}
+.s-icon-basic-case-24 {
+  &:before {
+    content: $s-icon-basic-case-24;
+  }
+}
+.s-icon-basic-check-mark-24 {
+  &:before {
+    content: $s-icon-basic-check-mark-24;
+  }
+}
+.s-icon-basic-check-marks-24 {
+  &:before {
+    content: $s-icon-basic-check-marks-24;
+  }
+}
+.s-icon-basic-circle-24 {
+  &:before {
+    content: $s-icon-basic-circle-24;
+  }
+}
+.s-icon-basic-circle-block-24 {
+  &:before {
+    content: $s-icon-basic-circle-block-24;
+  }
+}
+.s-icon-basic-circle-checked-24 {
+  &:before {
+    content: $s-icon-basic-circle-checked-24;
+  }
+}
+.s-icon-basic-circle-menu-24 {
+  &:before {
+    content: $s-icon-basic-circle-menu-24;
+  }
+}
+.s-icon-basic-circle-minus-24 {
+  &:before {
+    content: $s-icon-basic-circle-minus-24;
+  }
+}
+.s-icon-basic-circle-more-horizontal-24 {
+  &:before {
+    content: $s-icon-basic-circle-more-horizontal-24;
+  }
+}
+.s-icon-basic-circle-more-vertical-24 {
+  &:before {
+    content: $s-icon-basic-circle-more-vertical-24;
+  }
+}
+.s-icon-basic-circle-plus-24 {
+  &:before {
+    content: $s-icon-basic-circle-plus-24;
+  }
+}
+.s-icon-basic-circle-star-24 {
+  &:before {
+    content: $s-icon-basic-circle-star-24;
+  }
+}
+.s-icon-basic-circle-x-24 {
+  &:before {
+    content: $s-icon-basic-circle-x-24;
+  }
+}
+.s-icon-basic-clear-style-24 {
+  &:before {
+    content: $s-icon-basic-clear-style-24;
+  }
+}
+.s-icon-basic-clear-X-24 {
+  &:before {
+    content: $s-icon-basic-clear-X-24;
+  }
+}
+.s-icon-basic-clear-X-xs-24 {
+  &:before {
+    content: $s-icon-basic-clear-X-xs-24;
+  }
+}
+.s-icon-basic-close-24 {
+  &:before {
+    content: $s-icon-basic-close-24;
+  }
+}
+.s-icon-basic-copy-24 {
+  &:before {
+    content: $s-icon-basic-copy-24;
+  }
+}
+.s-icon-basic-cut-24 {
+  &:before {
+    content: $s-icon-basic-cut-24;
+  }
+}
+.s-icon-basic-dashboard-24 {
+  &:before {
+    content: $s-icon-basic-dashboard-24;
+  }
+}
+.s-icon-basic-delete-24 {
+  &:before {
+    content: $s-icon-basic-delete-24;
+  }
+}
+.s-icon-basic-download-24 {
+  &:before {
+    content: $s-icon-basic-download-24;
+  }
+}
+.s-icon-basic-download-bold-24 {
+  &:before {
+    content: $s-icon-basic-download-bold-24;
+  }
+}
+.s-icon-basic-drop-24 {
+  &:before {
+    content: $s-icon-basic-drop-24;
+  }
+}
+.s-icon-basic-edit-24 {
+  &:before {
+    content: $s-icon-basic-edit-24;
+  }
+}
+.s-icon-basic-external-link-24 {
+  &:before {
+    content: $s-icon-basic-external-link-24;
+  }
+}
+.s-icon-basic-eye-24 {
+  &:before {
+    content: $s-icon-basic-eye-24;
+  }
+}
+.s-icon-basic-eye-no-24 {
+  &:before {
+    content: $s-icon-basic-eye-no-24;
+  }
+}
+.s-icon-basic-filterlist-24 {
+  &:before {
+    content: $s-icon-basic-filterlist-24;
+  }
+}
+.s-icon-basic-flag-24 {
+  &:before {
+    content: $s-icon-basic-flag-24;
+  }
+}
+.s-icon-basic-flame-24 {
+  &:before {
+    content: $s-icon-basic-flame-24;
+  }
+}
+.s-icon-basic-glasses-24 {
+  &:before {
+    content: $s-icon-basic-glasses-24;
+  }
+}
+.s-icon-basic-globe-24 {
+  &:before {
+    content: $s-icon-basic-globe-24;
+  }
+}
+.s-icon-basic-globe-no-24 {
+  &:before {
+    content: $s-icon-basic-globe-no-24;
+  }
+}
+.s-icon-basic-heart-24 {
+  &:before {
+    content: $s-icon-basic-heart-24;
+  }
+}
+.s-icon-basic-heart-no-24 {
+  &:before {
+    content: $s-icon-basic-heart-no-24;
+  }
+}
+.s-icon-basic-home-24 {
+  &:before {
+    content: $s-icon-basic-home-24;
+  }
+}
+.s-icon-basic-image-24 {
+  &:before {
+    content: $s-icon-basic-image-24;
+  }
+}
+.s-icon-basic-inbox-24 {
+  &:before {
+    content: $s-icon-basic-inbox-24;
+  }
+}
+.s-icon-basic-layers-24 {
+  &:before {
+    content: $s-icon-basic-layers-24;
+  }
+}
+.s-icon-basic-lightning-24 {
+  &:before {
+    content: $s-icon-basic-lightning-24;
+  }
+}
+.s-icon-basic-lightning-no-24 {
+  &:before {
+    content: $s-icon-basic-lightning-no-24;
+  }
+}
+.s-icon-basic-link-24 {
+  &:before {
+    content: $s-icon-basic-link-24;
+  }
+}
+.s-icon-basic-link-no-24 {
+  &:before {
+    content: $s-icon-basic-link-no-24;
+  }
+}
+.s-icon-basic-list-24 {
+  &:before {
+    content: $s-icon-basic-list-24;
+  }
+}
+.s-icon-basic-mail-24 {
+  &:before {
+    content: $s-icon-basic-mail-24;
+  }
+}
+.s-icon-basic-maximize-24 {
+  &:before {
+    content: $s-icon-basic-maximize-24;
+  }
+}
+.s-icon-basic-menu-24 {
+  &:before {
+    content: $s-icon-basic-menu-24;
+  }
+}
+.s-icon-basic-menu-dots-24 {
+  &:before {
+    content: $s-icon-basic-menu-dots-24;
+  }
+}
+.s-icon-basic-mic-24 {
+  &:before {
+    content: $s-icon-basic-mic-24;
+  }
+}
+.s-icon-basic-mic-no-24 {
+  &:before {
+    content: $s-icon-basic-mic-no-24;
+  }
+}
+.s-icon-basic-minimize-24 {
+  &:before {
+    content: $s-icon-basic-minimize-24;
+  }
+}
+.s-icon-basic-minus-24 {
+  &:before {
+    content: $s-icon-basic-minus-24;
+  }
+}
+.s-icon-basic-more-horizontal-24 {
+  &:before {
+    content: $s-icon-basic-more-horizontal-24;
+  }
+}
+.s-icon-basic-more-vertical-24 {
+  &:before {
+    content: $s-icon-basic-more-vertical-24;
+  }
+}
+.s-icon-basic-newspaper-24 {
+  &:before {
+    content: $s-icon-basic-newspaper-24;
+  }
+}
+.s-icon-basic-options-3-24 {
+  &:before {
+    content: $s-icon-basic-options-3-24;
+  }
+}
+.s-icon-basic-options-24 {
+  &:before {
+    content: $s-icon-basic-options-24;
+  }
+}
+.s-icon-basic-paperclip-24 {
+  &:before {
+    content: $s-icon-basic-paperclip-24;
+  }
+}
+.s-icon-basic-paperclip-no-24 {
+  &:before {
+    content: $s-icon-basic-paperclip-no-24;
+  }
+}
+.s-icon-basic-pencil-create-24 {
+  &:before {
+    content: $s-icon-basic-pencil-create-24;
+  }
+}
+.s-icon-basic-pencil-edit-24 {
+  &:before {
+    content: $s-icon-basic-pencil-edit-24;
+  }
+}
+.s-icon-basic-photo-pic-24 {
+  &:before {
+    content: $s-icon-basic-photo-pic-24;
+  }
+}
+.s-icon-basic-placeholder-24 {
+  &:before {
+    content: $s-icon-basic-placeholder-24;
+  }
+}
+.s-icon-basic-plus-24 {
+  &:before {
+    content: $s-icon-basic-plus-24;
+  }
+}
+.s-icon-basic-presentation-24 {
+  &:before {
+    content: $s-icon-basic-presentation-24;
+  }
+}
+.s-icon-basic-printer-24 {
+  &:before {
+    content: $s-icon-basic-printer-24;
+  }
+}
+.s-icon-basic-pulse-24 {
+  &:before {
+    content: $s-icon-basic-pulse-24;
+  }
+}
+.s-icon-basic-receive-24 {
+  &:before {
+    content: $s-icon-basic-receive-24;
+  }
+}
+.s-icon-basic-scan-24 {
+  &:before {
+    content: $s-icon-basic-scan-24;
+  }
+}
+.s-icon-basic-scan-custom-24 {
+  &:before {
+    content: $s-icon-basic-scan-custom-24;
+  }
+}
+.s-icon-basic-screenshot-24 {
+  &:before {
+    content: $s-icon-basic-screenshot-24;
+  }
+}
+.s-icon-basic-search-24 {
+  &:before {
+    content: $s-icon-basic-search-24;
+  }
+}
+.s-icon-basic-send-24-1 {
+  &:before {
+    content: $s-icon-basic-send-24-1;
+  }
+}
+.s-icon-basic-send-24 {
+  &:before {
+    content: $s-icon-basic-send-24;
+  }
+}
+.s-icon-basic-settings-24 {
+  &:before {
+    content: $s-icon-basic-settings-24;
+  }
+}
+.s-icon-basic-share-24 {
+  &:before {
+    content: $s-icon-basic-share-24;
+  }
+}
+.s-icon-basic-share-arrow-24 {
+  &:before {
+    content: $s-icon-basic-share-arrow-24;
+  }
+}
+.s-icon-basic-star-24 {
+  &:before {
+    content: $s-icon-basic-star-24;
+  }
+}
+.s-icon-basic-star-no-24 {
+  &:before {
+    content: $s-icon-basic-star-no-24;
+  }
+}
+.s-icon-basic-sticker-24 {
+  &:before {
+    content: $s-icon-basic-sticker-24;
+  }
+}
+.s-icon-basic-table-24 {
+  &:before {
+    content: $s-icon-basic-table-24;
+  }
+}
+.s-icon-basic-text-align-center-24 {
+  &:before {
+    content: $s-icon-basic-text-align-center-24;
+  }
+}
+.s-icon-basic-text-align-justify-24 {
+  &:before {
+    content: $s-icon-basic-text-align-justify-24;
+  }
+}
+.s-icon-basic-text-align-left-24 {
+  &:before {
+    content: $s-icon-basic-text-align-left-24;
+  }
+}
+.s-icon-basic-text-align-right-24 {
+  &:before {
+    content: $s-icon-basic-text-align-right-24;
+  }
+}
+.s-icon-basic-text-bgcolor-24 {
+  &:before {
+    content: $s-icon-basic-text-bgcolor-24;
+  }
+}
+.s-icon-basic-text-bold-24 {
+  &:before {
+    content: $s-icon-basic-text-bold-24;
+  }
+}
+.s-icon-basic-text-color-24 {
+  &:before {
+    content: $s-icon-basic-text-color-24;
+  }
+}
+.s-icon-basic-text-italic-24 {
+  &:before {
+    content: $s-icon-basic-text-italic-24;
+  }
+}
+.s-icon-basic-text-underline-24 {
+  &:before {
+    content: $s-icon-basic-text-underline-24;
+  }
+}
+.s-icon-basic-thumbs-down-24 {
+  &:before {
+    content: $s-icon-basic-thumbs-down-24;
+  }
+}
+.s-icon-basic-thumbs-up-24 {
+  &:before {
+    content: $s-icon-basic-thumbs-up-24;
+  }
+}
+.s-icon-basic-toggle-left-24 {
+  &:before {
+    content: $s-icon-basic-toggle-left-24;
+  }
+}
+.s-icon-basic-toggle-right-24 {
+  &:before {
+    content: $s-icon-basic-toggle-right-24;
+  }
+}
+.s-icon-basic-trash-24 {
+  &:before {
+    content: $s-icon-basic-trash-24;
+  }
+}
+.s-icon-basic-trash-empty-24 {
+  &:before {
+    content: $s-icon-basic-trash-empty-24;
+  }
+}
+.s-icon-basic-user-24 {
+  &:before {
+    content: $s-icon-basic-user-24;
+  }
+}
+.s-icon-basic-video-24 {
+  &:before {
+    content: $s-icon-basic-video-24;
+  }
+}
+.s-icon-basic-video-no-24 {
+  &:before {
+    content: $s-icon-basic-video-no-24;
+  }
+}
+.s-icon-basic-zoom-in-24 {
+  &:before {
+    content: $s-icon-basic-zoom-in-24;
+  }
+}
+.s-icon-basic-zoom-out-24 {
+  &:before {
+    content: $s-icon-basic-zoom-out-24;
+  }
+}
+.s-icon-call-call-add-24 {
+  &:before {
+    content: $s-icon-call-call-add-24;
+  }
+}
+.s-icon-call-call-calling-24 {
+  &:before {
+    content: $s-icon-call-call-calling-24;
+  }
+}
+.s-icon-call-call-decline-24 {
+  &:before {
+    content: $s-icon-call-call-decline-24;
+  }
+}
+.s-icon-call-call-end-24 {
+  &:before {
+    content: $s-icon-call-call-end-24;
+  }
+}
+.s-icon-call-call-forwarded-24 {
+  &:before {
+    content: $s-icon-call-call-forwarded-24;
+  }
+}
+.s-icon-call-call-hash-24 {
+  &:before {
+    content: $s-icon-call-call-hash-24;
+  }
+}
+.s-icon-call-call-hold-24 {
+  &:before {
+    content: $s-icon-call-call-hold-24;
+  }
+}
+.s-icon-call-call-incoming-24 {
+  &:before {
+    content: $s-icon-call-call-incoming-24;
+  }
+}
+.s-icon-call-call-missed-24 {
+  &:before {
+    content: $s-icon-call-call-missed-24;
+  }
+}
+.s-icon-call-call-muted-24 {
+  &:before {
+    content: $s-icon-call-call-muted-24;
+  }
+}
+.s-icon-call-call-no-24 {
+  &:before {
+    content: $s-icon-call-call-no-24;
+  }
+}
+.s-icon-call-call-numbers-24 {
+  &:before {
+    content: $s-icon-call-call-numbers-24;
+  }
+}
+.s-icon-call-call-outcoming-24 {
+  &:before {
+    content: $s-icon-call-call-outcoming-24;
+  }
+}
+.s-icon-call-call-phone-24 {
+  &:before {
+    content: $s-icon-call-call-phone-24;
+  }
+}
+.s-icon-call-call-recieved-24 {
+  &:before {
+    content: $s-icon-call-call-recieved-24;
+  }
+}
+.s-icon-call-call-voicemail-24 {
+  &:before {
+    content: $s-icon-call-call-voicemail-24;
+  }
+}
+.s-icon-chatting-comment-24 {
+  &:before {
+    content: $s-icon-chatting-comment-24;
+  }
+}
+.s-icon-chatting-comment-checked-24 {
+  &:before {
+    content: $s-icon-chatting-comment-checked-24;
+  }
+}
+.s-icon-chatting-comment-delete-24 {
+  &:before {
+    content: $s-icon-chatting-comment-delete-24;
+  }
+}
+.s-icon-chatting-comment-minus-24 {
+  &:before {
+    content: $s-icon-chatting-comment-minus-24;
+  }
+}
+.s-icon-chatting-comment-plus-24 {
+  &:before {
+    content: $s-icon-chatting-comment-plus-24;
+  }
+}
+.s-icon-chatting-comment-text-24 {
+  &:before {
+    content: $s-icon-chatting-comment-text-24;
+  }
+}
+.s-icon-chatting-question-24 {
+  &:before {
+    content: $s-icon-chatting-question-24;
+  }
+}
+.s-icon-connection-airplay-24 {
+  &:before {
+    content: $s-icon-connection-airplay-24;
+  }
+}
+.s-icon-connection-bluetooth-24 {
+  &:before {
+    content: $s-icon-connection-bluetooth-24;
+  }
+}
+.s-icon-connection-bluetooth-no-24 {
+  &:before {
+    content: $s-icon-connection-bluetooth-no-24;
+  }
+}
+.s-icon-connection-broadcast-24 {
+  &:before {
+    content: $s-icon-connection-broadcast-24;
+  }
+}
+.s-icon-connection-broadcasting-24 {
+  &:before {
+    content: $s-icon-connection-broadcasting-24;
+  }
+}
+.s-icon-connection-cast-24 {
+  &:before {
+    content: $s-icon-connection-cast-24;
+  }
+}
+.s-icon-connection-wi-fi-24 {
+  &:before {
+    content: $s-icon-connection-wi-fi-24;
+  }
+}
+.s-icon-connection-wi-fi-no-24 {
+  &:before {
+    content: $s-icon-connection-wi-fi-no-24;
+  }
+}
+.s-icon-file-clipboard-24 {
+  &:before {
+    content: $s-icon-file-clipboard-24;
+  }
+}
+.s-icon-file-clipboard-checked-24 {
+  &:before {
+    content: $s-icon-file-clipboard-checked-24;
+  }
+}
+.s-icon-file-clipboard-delete-24 {
+  &:before {
+    content: $s-icon-file-clipboard-delete-24;
+  }
+}
+.s-icon-file-clipboard-minus-24 {
+  &:before {
+    content: $s-icon-file-clipboard-minus-24;
+  }
+}
+.s-icon-file-clipboard-plus-24 {
+  &:before {
+    content: $s-icon-file-clipboard-plus-24;
+  }
+}
+.s-icon-file-clipboard-text-24 {
+  &:before {
+    content: $s-icon-file-clipboard-text-24;
+  }
+}
+.s-icon-file-file-24 {
+  &:before {
+    content: $s-icon-file-file-24;
+  }
+}
+.s-icon-file-file-checked-24 {
+  &:before {
+    content: $s-icon-file-file-checked-24;
+  }
+}
+.s-icon-file-file-code-24 {
+  &:before {
+    content: $s-icon-file-file-code-24;
+  }
+}
+.s-icon-file-file-create-24 {
+  &:before {
+    content: $s-icon-file-file-create-24;
+  }
+}
+.s-icon-file-file-delete-24 {
+  &:before {
+    content: $s-icon-file-file-delete-24;
+  }
+}
+.s-icon-file-file-download-24 {
+  &:before {
+    content: $s-icon-file-file-download-24;
+  }
+}
+.s-icon-file-file-draft-24 {
+  &:before {
+    content: $s-icon-file-file-draft-24;
+  }
+}
+.s-icon-file-file-minus-24 {
+  &:before {
+    content: $s-icon-file-file-minus-24;
+  }
+}
+.s-icon-file-file-plus-24 {
+  &:before {
+    content: $s-icon-file-file-plus-24;
+  }
+}
+.s-icon-file-file-scan-24 {
+  &:before {
+    content: $s-icon-file-file-scan-24;
+  }
+}
+.s-icon-file-file-shredder-24 {
+  &:before {
+    content: $s-icon-file-file-shredder-24;
+  }
+}
+.s-icon-file-file-text-24 {
+  &:before {
+    content: $s-icon-file-file-text-24;
+  }
+}
+.s-icon-file-file-upload-24 {
+  &:before {
+    content: $s-icon-file-file-upload-24;
+  }
+}
+.s-icon-file-folder-24 {
+  &:before {
+    content: $s-icon-file-folder-24;
+  }
+}
+.s-icon-file-folder-arrow-24 {
+  &:before {
+    content: $s-icon-file-folder-arrow-24;
+  }
+}
+.s-icon-file-folder-checked-24 {
+  &:before {
+    content: $s-icon-file-folder-checked-24;
+  }
+}
+.s-icon-file-folder-cloud-24 {
+  &:before {
+    content: $s-icon-file-folder-cloud-24;
+  }
+}
+.s-icon-file-folder-create-24 {
+  &:before {
+    content: $s-icon-file-folder-create-24;
+  }
+}
+.s-icon-file-folder-delete-24 {
+  &:before {
+    content: $s-icon-file-folder-delete-24;
+  }
+}
+.s-icon-file-folder-minus-24 {
+  &:before {
+    content: $s-icon-file-folder-minus-24;
+  }
+}
+.s-icon-file-folder-music-24 {
+  &:before {
+    content: $s-icon-file-folder-music-24;
+  }
+}
+.s-icon-file-folder-opened-24 {
+  &:before {
+    content: $s-icon-file-folder-opened-24;
+  }
+}
+.s-icon-file-folder-photo-24 {
+  &:before {
+    content: $s-icon-file-folder-photo-24;
+  }
+}
+.s-icon-file-folder-plus-24 {
+  &:before {
+    content: $s-icon-file-folder-plus-24;
+  }
+}
+.s-icon-file-folder-zip-24 {
+  &:before {
+    content: $s-icon-file-folder-zip-24;
+  }
+}
+.s-icon-file-note-24 {
+  &:before {
+    content: $s-icon-file-note-24;
+  }
+}
+.s-icon-file-note-text-24 {
+  &:before {
+    content: $s-icon-file-note-text-24;
+  }
+}
+.s-icon-finance-account-balance-24 {
+  &:before {
+    content: $s-icon-finance-account-balance-24;
+  }
+}
+.s-icon-finance-bitcoin-24 {
+  &:before {
+    content: $s-icon-finance-bitcoin-24;
+  }
+}
+.s-icon-finance-control-point-duplicate-deposit-24 {
+  &:before {
+    content: $s-icon-finance-control-point-duplicate-deposit-24;
+  }
+}
+.s-icon-finance-creditcard-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-24;
+  }
+}
+.s-icon-finance-creditcard-add-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-add-24;
+  }
+}
+.s-icon-finance-creditcard-face-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-face-24;
+  }
+}
+.s-icon-finance-creditcard-income-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-income-24;
+  }
+}
+.s-icon-finance-creditcard-no-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-no-24;
+  }
+}
+.s-icon-finance-creditcard-outcome-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-outcome-24;
+  }
+}
+.s-icon-finance-creditcard-scan-24 {
+  &:before {
+    content: $s-icon-finance-creditcard-scan-24;
+  }
+}
+.s-icon-finance-ethereum-dontuse-24 {
+  &:before {
+    content: $s-icon-finance-ethereum-dontuse-24;
+  }
+}
+.s-icon-finance-liquidity-24 {
+  &:before {
+    content: $s-icon-finance-liquidity-24;
+  }
+}
+.s-icon-finance-paypass-24 {
+  &:before {
+    content: $s-icon-finance-paypass-24;
+  }
+}
+.s-icon-finance-PSWAP-24 {
+  &:before {
+    content: $s-icon-finance-PSWAP-24;
+  }
+}
+.s-icon-finance-receive-show-QR-24 {
+  &:before {
+    content: $s-icon-finance-receive-show-QR-24;
+  }
+}
+.s-icon-finance-receive-24 {
+  &:before {
+    content: $s-icon-finance-receive-24;
+  }
+}
+.s-icon-finance-send-24 {
+  &:before {
+    content: $s-icon-finance-send-24;
+  }
+}
+.s-icon-finance-strongbox-24 {
+  &:before {
+    content: $s-icon-finance-strongbox-24;
+  }
+}
+.s-icon-finance-VALerc20-outline-24 {
+  &:before {
+    content: $s-icon-finance-VALerc20-outline-24;
+  }
+}
+.s-icon-finance-wallet-24 {
+  &:before {
+    content: $s-icon-finance-wallet-24;
+  }
+}
+.s-icon-finance-XOR-outline-24 {
+  &:before {
+    content: $s-icon-finance-XOR-outline-24;
+  }
+}
+.s-icon-various-advertisement-24 {
+  &:before {
+    content: $s-icon-various-advertisement-24;
+  }
+}
+.s-icon-various-atom-24 {
+  &:before {
+    content: $s-icon-various-atom-24;
+  }
+}
+.s-icon-various-bone-24 {
+  &:before {
+    content: $s-icon-various-bone-24;
+  }
+}
+.s-icon-various-brightness-high-24 {
+  &:before {
+    content: $s-icon-various-brightness-high-24;
+  }
+}
+.s-icon-various-brightness-low-24 {
+  &:before {
+    content: $s-icon-various-brightness-low-24;
+  }
+}
+.s-icon-various-contrast-24 {
+  &:before {
+    content: $s-icon-various-contrast-24;
+  }
+}
+.s-icon-various-cross-24 {
+  &:before {
+    content: $s-icon-various-cross-24;
+  }
+}
+.s-icon-various-crosshairs-24 {
+  &:before {
+    content: $s-icon-various-crosshairs-24;
+  }
+}
+.s-icon-various-cup-24 {
+  &:before {
+    content: $s-icon-various-cup-24;
+  }
+}
+.s-icon-various-form-24 {
+  &:before {
+    content: $s-icon-various-form-24;
+  }
+}
+.s-icon-various-infinity-24 {
+  &:before {
+    content: $s-icon-various-infinity-24;
+  }
+}
+.s-icon-various-items-24 {
+  &:before {
+    content: $s-icon-various-items-24;
+  }
+}
+.s-icon-various-lightbulb-24 {
+  &:before {
+    content: $s-icon-various-lightbulb-24;
+  }
+}
+.s-icon-various-moon-24 {
+  &:before {
+    content: $s-icon-various-moon-24;
+  }
+}
+.s-icon-various-nut-24 {
+  &:before {
+    content: $s-icon-various-nut-24;
+  }
+}
+.s-icon-various-planet-24 {
+  &:before {
+    content: $s-icon-various-planet-24;
+  }
+}
+.s-icon-various-pocket-24 {
+  &:before {
+    content: $s-icon-various-pocket-24;
+  }
+}
+.s-icon-various-rocket-24 {
+  &:before {
+    content: $s-icon-various-rocket-24;
+  }
+}
+.s-icon-various-sun-24 {
+  &:before {
+    content: $s-icon-various-sun-24;
+  }
+}
+.s-icon-various-toy-horse-24 {
+  &:before {
+    content: $s-icon-various-toy-horse-24;
   }
 }
diff --git a/src/styles/input.scss b/src/styles/input.scss
index cdef94b3..54ef7e7c 100644
--- a/src/styles/input.scss
+++ b/src/styles/input.scss
@@ -147,7 +147,7 @@
     .el-input > input {
       padding-right: 56px;
     }
-    .s-icon-file-upload {
+    .s-icon-file-file-upload-24 {
       top: 16px;
       right: 16px;
       font-size: var(--s-icon-font-size-big);
diff --git a/src/styles/select.scss b/src/styles/select.scss
index 429e886c..86f3ace6 100644
--- a/src/styles/select.scss
+++ b/src/styles/select.scss
@@ -42,7 +42,7 @@ $select-prefix-height: $s-size-mini;
       font-family: $icons-font;
       font-size: var(--s-icon-font-size-mini);
       &:before {
-        content: $s-icon-chevron-top;
+        content: $s-icon-chevron-top-16;
       }
     }
     .el-input {
diff --git a/src/styles/table.scss b/src/styles/table.scss
index af110e8b..414eb157 100644
--- a/src/styles/table.scss
+++ b/src/styles/table.scss
@@ -126,7 +126,7 @@
   top: 0;
   > .el-icon.el-icon-arrow-right {
     font-family: $s-font-family-icons;
-    @extend .s-icon-chevron-bottom;
+    @extend .s-icon-chevron-down-rounded-16;
   }
   &--expanded {
     transform: rotate(180deg);
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index e8267e60..8c0e6d91 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -70,33 +70,37 @@ $s-icon-font-size-small: 18px !default;
 $s-icon-font-size-medium: 20px !default;
 $s-icon-font-size-big: 24px !default;
 // Font heading sizes
+$s-heading0-font-size: 40px !default;
 $s-heading1-font-size: 36px !default;
 $s-heading2-font-size: 30px !default;
 $s-heading3-font-size: 24px !default;
 $s-heading4-font-size: 18px !default;
 $s-heading5-font-size: 16px !default;
 $s-heading6-font-size: 14px !default;
+$s-heading7-font-size: 12px !default;
+$s-heading8-font-size: 10px !default;
 // Font Line Height
-$s-line-height-base: 1.4;
-$s-line-height-mini: 1.2;
-$s-line-height-small: 1.3;
-$s-line-height-medium: 1.5;
-$s-line-height-big: 1.8;
+$s-line-height-base: 1.4 !default;
+$s-line-height-mini: 1.2 !default;
+$s-line-height-small: 1.3 !default;
+$s-line-height-medium: 1.5 !default;
+$s-line-height-big: 1.8 !default;
 // Letter Spacing
-$s-letter-spacing-mini: -0.04em;
-$s-letter-spacing-small: -0.02em;
-$s-letter-spacing-medium: -0.01em;
-$s-letter-spacing-big: 0.01em;
-$s-letter-spacing-type: 0.06em;
+$s-letter-spacing-mini: -0.04em !default;
+$s-letter-spacing-small: -0.02em !default;
+$s-letter-spacing-medium: -0.01em !default;
+$s-letter-spacing-big: 0.01em !default;
+$s-letter-spacing-large: 0.03em !default;
+$s-letter-spacing-extra-large: 0.06em !default;
 // Font Feature Settings
-$s-font-feature-settings-common: "tnum" on, "lnum" on, "case" on, "salt" on, "ss01" on;
-$s-font-feature-settings-heading: "tnum" on, "lnum" on, "salt" on, "case" on;
-$s-font-feature-settings-caps-heading: "tnum" on, "lnum" on, "case" on;
-$s-font-feature-settings-caps: "case" on;
-$s-font-feature-settings-singleline: "salt" on, "case" on;
-$s-font-feature-settings-card-title: "tnum" on, "lnum" on, "ss01" on;
-$s-font-feature-settings-input: "tnum" on, "lnum" on;
-$s-font-feature-settings-button: "tnum" on, "lnum" on, "salt" on;
+$s-font-feature-settings-common: "tnum" on, "lnum" on, "case" on, "salt" on, "ss01" on !default;
+$s-font-feature-settings-heading: "tnum" on, "lnum" on, "salt" on, "case" on !default;
+$s-font-feature-settings-caps-heading: "tnum" on, "lnum" on, "case" on !default;
+$s-font-feature-settings-caps: "case" on !default;
+$s-font-feature-settings-singleline: "salt" on, "case" on !default;
+$s-font-feature-settings-card-title: "tnum" on, "lnum" on, "ss01" on !default;
+$s-font-feature-settings-input: "tnum" on, "lnum" on !default;
+$s-font-feature-settings-button: "tnum" on, "lnum" on, "salt" on !default;
 
 // Responsive
 $--sm: 640px !default;
@@ -166,12 +170,15 @@ $--breakpoints-spec: (
   --s-icon-font-size-medium: #{$s-icon-font-size-medium};
   --s-icon-font-size-big: #{$s-icon-font-size-big};
   // Heading Font Sizes
+  --s-heading0-font-size: #{$s-heading0-font-size};
   --s-heading1-font-size: #{$s-heading1-font-size};
   --s-heading2-font-size: #{$s-heading2-font-size};
   --s-heading3-font-size: #{$s-heading3-font-size};
   --s-heading4-font-size: #{$s-heading4-font-size};
   --s-heading5-font-size: #{$s-heading5-font-size};
   --s-heading6-font-size: #{$s-heading6-font-size};
+  --s-heading7-font-size: #{$s-heading7-font-size};
+  --s-heading8-font-size: #{$s-heading8-font-size};
   // Font Line Height
   --s-line-height-base: #{$s-line-height-base};
   --s-line-height-mini: #{$s-line-height-mini};
@@ -183,16 +190,17 @@ $--breakpoints-spec: (
   --s-letter-spacing-small: #{$s-letter-spacing-small};
   --s-letter-spacing-medium: #{$s-letter-spacing-medium};
   --s-letter-spacing-big: #{$s-letter-spacing-big};
-  --s-letter-spacing-type: #{$s-letter-spacing-type};
+  --s-letter-spacing-large: #{$s-letter-spacing-large};
+  --s-letter-spacing-extra-large: #{$s-letter-spacing-extra-large};
   // Font Feature Settings
-  --s-font-feature-settings-common: #{$s-font-feature-settings-common};
-  --s-font-feature-settings-heading: #{$s-font-feature-settings-heading};
-  --s-font-feature-settings-caps-heading: #{$s-font-feature-settings-caps-heading};
-  --s-font-feature-settings-caps: #{$s-font-feature-settings-caps};
-  --s-font-feature-settings-singleline: #{$s-font-feature-settings-singleline};
-  --s-font-feature-settings-card-title: #{$s-font-feature-settings-card-title};
-  --s-font-feature-settings-input: #{$s-font-feature-settings-input};
-  --s-font-feature-settings-button: #{$s-font-feature-settings-button};
+  --s-font-feature-settings-common: "tnum" on, "lnum" on, "case" on, "salt" on, "ss01" on; // $s-font-feature-settings-common
+  --s-font-feature-settings-heading: "tnum" on, "lnum" on, "salt" on, "case" on; // $s-font-feature-settings-heading
+  --s-font-feature-settings-caps-heading: "tnum" on, "lnum" on, "case" on; // $s-font-feature-settings-caps-heading
+  --s-font-feature-settings-caps: "case" on; // $s-font-feature-settings-caps
+  --s-font-feature-settings-singleline: "salt" on, "case" on; // $s-font-feature-settings-singleline
+  --s-font-feature-settings-card-title: "tnum" on, "lnum" on, "ss01" on; // $s-font-feature-settings-card-title
+  --s-font-feature-settings-input: "tnum" on, "lnum" on; // $s-font-feature-settings-input
+  --s-font-feature-settings-button: "tnum" on, "lnum" on, "salt" on; // $s-font-feature-settings-button
   // Size
   --s-size-mini: #{$s-size-mini};
   --s-size-small: #{$s-size-small};