diff --git a/examples/layout/buttons/buttons.html b/examples/layout/buttons/buttons.html
new file mode 100644
index 0000000..717112b
--- /dev/null
+++ b/examples/layout/buttons/buttons.html
@@ -0,0 +1,38 @@
+
+
+
+
+
+ Buttons
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/examples/layout/buttons/buttons.scss b/examples/layout/buttons/buttons.scss
new file mode 100644
index 0000000..7097683
--- /dev/null
+++ b/examples/layout/buttons/buttons.scss
@@ -0,0 +1,104 @@
+@import "../../../framework";
+
+body {
+ background-color: #8faf91;
+}
+
+$color-ln: #bab7ff;
+$color-bgr: #1d9d73;
+
+.mail {
+
+ .mail-15 {
+ @include mail-button(
+ 15px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .mail-30 {
+ @include mail-button(
+ 30px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .mail-60 {
+ @include mail-button(
+ 60px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .mail-120 {
+ @include mail-button(
+ 120px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+}
+
+.search {
+
+ .search-15 {
+@include search-symbol-button(
+ 15px,
+ $color-ln,
+ $color-bgr
+)
+ }
+ .search-30 {
+ @include search-symbol-button(
+ 30px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .search-60 {
+ @include search-symbol-button(
+ 60px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .search-120 {
+ @include search-symbol-button(
+ 120px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+}
+
+.arrow {
+
+ .arrow-15 {
+ @include arrow-button(
+ 15px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .arrow-30 {
+ @include arrow-button(
+ 30px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .arrow-60 {
+ @include arrow-button(
+ 60px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+ .arrow-120 {
+ @include arrow-button(
+ 120px,
+ $color-ln,
+ $color-bgr
+ )
+ }
+}
\ No newline at end of file
diff --git a/mixins/_00-mixins.scss b/mixins/_00-mixins.scss
index ac823f6..6f12335 100644
--- a/mixins/_00-mixins.scss
+++ b/mixins/_00-mixins.scss
@@ -9,6 +9,8 @@
@import "layout/menus/_00-menus";
@import "layout/buttons/search";
+@import "layout/buttons/mail";
+@import "layout/buttons/arrow";
// Queries
@import "queries/media-queries";
diff --git a/mixins/layout/buttons/_arrow.scss b/mixins/layout/buttons/_arrow.scss
new file mode 100644
index 0000000..c31b382
--- /dev/null
+++ b/mixins/layout/buttons/_arrow.scss
@@ -0,0 +1,50 @@
+@mixin arrow-button(
+ $size,
+ $color-lines,
+ $color-bg
+) {
+
+ $size-line: $size/15;
+ position: relative;
+
+ box-sizing: border-box;
+ width: $size;
+ height: $size;
+
+ border: solid $size-line $color-lines;
+ border-radius: $size;
+
+ background-color: $color-bg;
+
+ &:before {
+ //content: '';
+ //display: block;
+ //
+ //position: absolute;
+ //top:($size/3) - ($size-line*2);
+ //left:($size/4) - ($size-line*2);
+ //
+ ////box-sizing: border-box;
+ //width: $size/2;
+ //height: $size/3;
+ //
+ //border:solid $size-line $color-lines;
+ }
+ &:after {
+ content: '';
+ display: block;
+
+ position: absolute;
+ top: $size/3;
+ left:$size*0.2643;
+
+ box-sizing: border-box;
+ width: $size/3;
+ height: $size/3;
+
+ border-top:solid $size-line $color-lines;
+ border-left:solid $size-line $color-lines;
+
+ transform: rotate(45deg);
+ }
+}
\ No newline at end of file
diff --git a/mixins/layout/buttons/_mail.scss b/mixins/layout/buttons/_mail.scss
new file mode 100644
index 0000000..b72fe8a
--- /dev/null
+++ b/mixins/layout/buttons/_mail.scss
@@ -0,0 +1,50 @@
+@mixin mail-button(
+ $size,
+ $color-lines,
+ $color-bg
+) {
+
+ $size-line: $size/15;
+ position: relative;
+
+ box-sizing: border-box;
+ width: $size;
+ height: $size;
+
+ border: solid $size-line $color-lines;
+ border-radius: $size;
+
+ background-color: $color-bg;
+
+ &:before {
+ content: '';
+ display: block;
+
+ position: absolute;
+ top:($size/3) - ($size-line*2);
+ left:($size/4) - ($size-line*2);
+
+ //box-sizing: border-box;
+ width: $size/2;
+ height: $size/3;
+
+ border:solid $size-line $color-lines;
+ }
+ &:after {
+ content: '';
+ display: block;
+
+ position: absolute;
+ top: $size*0.0976;
+ left:$size*0.2643;
+
+ box-sizing: border-box;
+ width: $size/3;
+ height: $size/3;
+
+ border-bottom:solid $size-line $color-lines;
+ border-right:solid $size-line $color-lines;
+
+ transform: rotate(45deg);
+ }
+}
\ No newline at end of file