diff --git a/lib/components/theme.ts b/lib/components/theme.ts
index 0e34498..cffb941 100644
--- a/lib/components/theme.ts
+++ b/lib/components/theme.ts
@@ -28,16 +28,16 @@ export const penaMuiTheme = createTheme({
         },
         purple: {
             main: "#7E2AEA",
-            dark: "#581CA7",  
-            light: "#944FEE",  
+            dark: "#581CA7",
+            light: "#944FEE",
         },
         bg: {
-            main: "#333647", 
-            dark: "#252734", 
+            main: "#333647",
+            dark: "#252734",
         },
         gray: {
-            main: "#9A9AAF", 
-            dark: "#4D4D4D", 
+            main: "#9A9AAF",
+            dark: "#4D4D4D",
         },
         orange: {
             main: "#FB5607",
@@ -50,8 +50,6 @@ export const penaMuiTheme = createTheme({
                 {
                     props: { variant: "pena-contained-dark" },
                     style: ({ theme }) => theme.unstable_sx({
-                        border: `1px solid ${theme.palette.purple.main}`,
-                        backgroundColor: theme.palette.purple.main,
                         minWidth: "180px",
                         py: "9px",
                         px: "43px",
@@ -62,21 +60,23 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 400,
                         textTransform: "none",
                         color: "white",
+                        backgroundColor: theme.palette.purple.main,
+                        border: `1px solid ${theme.palette.purple.main}`,
                         "&:hover": {
+                            color: "white",
                             backgroundColor: theme.palette.purple.light,
                             border: `1px solid ${theme.palette.purple.light}`,
                         },
                         "&:active": {
-                            backgroundColor: "#FFFFFF",
                             color: theme.palette.purple.main,
+                            backgroundColor: "white",
+                            border: `1px solid ${theme.palette.purple.main}`,
                         }
                     }),
                 },
                 {
                     props: { variant: "pena-outlined-dark" },
                     style: ({ theme }) => theme.unstable_sx({
-                        border: `1px solid white`,
-                        backgroundColor: "rgb(0 0 0 / 0)",
                         minWidth: "180px",
                         py: "9px",
                         px: "43px",
@@ -87,20 +87,23 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 400,
                         textTransform: "none",
                         color: "white",
+                        backgroundColor: "rgb(0 0 0 / 0)",
+                        border: `1px solid white`,
                         "&:hover": {
+                            color: "white",
                             backgroundColor: theme.palette.bg.dark,
+                            border: `1px solid white`,
                         },
                         "&:active": {
+                            color: "white",
                             backgroundColor: theme.palette.purple.main,
-                            borderColor: theme.palette.purple.main,
+                            border: `1px solid ${theme.palette.purple.main}`,
                         }
                     }),
                 },
                 {
                     props: { variant: "pena-contained-light" },
                     style: ({ theme }) => theme.unstable_sx({
-                        border: `1px solid white`,
-                        backgroundColor: "white",
                         minWidth: "180px",
                         py: "9px",
                         px: "43px",
@@ -111,13 +114,16 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 400,
                         textTransform: "none",
                         color: theme.palette.bg.dark,
+                        backgroundColor: "white",
+                        border: `1px solid white`,
                         "&:hover": {
+                            color: theme.palette.bg.dark,
                             backgroundColor: theme.palette.background.default,
                             border: `1px solid ${theme.palette.background.default}`,
                         },
                         "&:active": {
-                            backgroundColor: "black",
                             color: "white",
+                            backgroundColor: "black",
                             border: `1px solid black`,
                         }
                     }),
@@ -125,8 +131,6 @@ export const penaMuiTheme = createTheme({
                 {
                     props: { variant: "pena-outlined-light" },
                     style: ({ theme }) => theme.unstable_sx({
-                        border: `1px solid white`,
-                        backgroundColor: "rgb(0 0 0 / 0)",
                         minWidth: "180px",
                         py: "9px",
                         px: "43px",
@@ -137,20 +141,23 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 400,
                         textTransform: "none",
                         color: "white",
+                        backgroundColor: "rgb(0 0 0 / 0)",
+                        border: `1px solid white`,
                         "&:hover": {
+                            color: "white",
                             backgroundColor: "#581CA7",
+                            border: `1px solid white`,
                         },
                         "&:active": {
+                            color: "white",
                             backgroundColor: "black",
-                            borderColor: "black",
+                            border: `1px solid black`,
                         }
                     }),
                 },
                 {
                     props: { variant: "pena-outlined-purple" },
                     style: ({ theme }) => theme.unstable_sx({
-                        border: `1px solid ${theme.palette.purple.main}`,
-                        backgroundColor: "rgb(0 0 0 / 0)",
                         minWidth: "180px",
                         py: "9px",
                         px: "43px",
@@ -161,20 +168,23 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 400,
                         textTransform: "none",
                         color: theme.palette.purple.main,
+                        backgroundColor: "rgb(0 0 0 / 0)",
+                        border: `1px solid ${theme.palette.purple.main}`,
                         "&:hover": {
+                            color: theme.palette.purple.main,
                             backgroundColor: theme.palette.background.default,
+                            border: `1px solid ${theme.palette.purple.main}`,
                         },
                         "&:active": {
-                            backgroundColor: "#581CA7",
-                            borderColor: "#581CA7",
                             color: "white",
+                            backgroundColor: theme.palette.purple.dark,
+                            border: `1px solid ${theme.palette.purple.dark}`,
                         }
                     }),
                 },
                 {
                     props: { variant: "pena-navitem-dark" },
                     style: ({ theme }) => theme.unstable_sx({
-                        backgroundColor: "rgb(0 0 0 / 0)",
                         p: 0,
                         boxShadow: "none",
                         fontSize: "16px",
@@ -182,19 +192,20 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 500,
                         textTransform: "none",
                         color: "white",
+                        backgroundColor: "rgb(0 0 0 / 0)",
                         "&:hover": {
                             color: theme.palette.purple.light,
                             backgroundColor: "rgb(0 0 0 / 0)",
                         },
                         "&:active": {
                             color: theme.palette.purple.light,
+                            backgroundColor: "rgb(0 0 0 / 0)",
                         }
                     }),
                 },
                 {
                     props: { variant: "pena-navitem-light" },
                     style: ({ theme }) => theme.unstable_sx({
-                        backgroundColor: "rgb(0 0 0 / 0)",
                         p: 0,
                         boxShadow: "none",
                         fontSize: "16px",
@@ -202,12 +213,41 @@ export const penaMuiTheme = createTheme({
                         fontWeight: 500,
                         textTransform: "none",
                         color: "black",
+                        backgroundColor: "rgb(0 0 0 / 0)",
                         "&:hover": {
                             color: theme.palette.purple.main,
                             backgroundColor: "rgb(0 0 0 / 0)",
                         },
                         "&:active": {
                             color: theme.palette.purple.main,
+                            backgroundColor: "rgb(0 0 0 / 0)",
+                        }
+                    }),
+                },
+                {
+                    props: { variant: "pena-contained-gray" },
+                    style: ({ theme }) => theme.unstable_sx({
+                        minWidth: "180px",
+                        py: "9px",
+                        px: "43px",
+                        borderRadius: "8px",
+                        boxShadow: "none",
+                        fontSize: "18px",
+                        lineHeight: "24px",
+                        fontWeight: 400,
+                        textTransform: "none",
+                        color: theme.palette.purple.main,
+                        backgroundColor: theme.palette.background.default,
+                        border: `1px solid ${theme.palette.gray.main}`,
+                        "&:hover": {
+                            color: "white",
+                            backgroundColor: theme.palette.purple.main,
+                            border: `1px solid ${theme.palette.purple.main}`,
+                        },
+                        "&:active": {
+                            color: "white",
+                            backgroundColor: "black",
+                            border: `1px solid black`,
                         }
                     }),
                 },
@@ -334,6 +374,7 @@ declare module '@mui/material/Button' {
         "pena-outlined-purple": true;
         "pena-navitem-light": true;
         "pena-navitem-dark": true;
+        "pena-contained-gray": true;
     }
 }
 
diff --git a/package.json b/package.json
index 2ef8cd7..fb61dcb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@frontend/kitui",
-    "version": "1.0.37",
+    "version": "1.0.38",
     "description": "test",
     "main": "./dist/index.js",
     "module": "./dist/index.js",
diff --git a/src/App.tsx b/src/App.tsx
index 3407f50..23a6989 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -49,6 +49,10 @@ export function App() {
                     code={`<Button variant="pena-outlined-purple">Перейти</Button>`}
                     element={<Button variant="pena-outlined-purple">Перейти</Button>}
                 />
+                <ComponentWithCode
+                    code={`<Button variant="pena-contained-gray">Купить</Button>`}
+                    element={<Button variant="pena-contained-gray">Купить</Button>}
+                />
                 <ComponentWithCode
                     code={`<Button variant="pena-navitem-dark">Подробнее</Button>`}
                     element={<Button variant="pena-navitem-dark">Подробнее</Button>}