diff --git a/client/src/features/auth-oauth/index.ts b/client/src/features/auth-oauth/index.ts
new file mode 100644
index 0000000..bbe2712
--- /dev/null
+++ b/client/src/features/auth-oauth/index.ts
@@ -0,0 +1 @@
+export { OAuthButtons } from './ui/OAuthButtons'
diff --git a/client/src/features/auth-oauth/ui/OAuthButtons.tsx b/client/src/features/auth-oauth/ui/OAuthButtons.tsx
new file mode 100644
index 0000000..0ba4be5
--- /dev/null
+++ b/client/src/features/auth-oauth/ui/OAuthButtons.tsx
@@ -0,0 +1,27 @@
+import Button from '@mui/material/Button'
+import Stack from '@mui/material/Stack'
+import { getOAuthUrl, oauthProviders } from '../lib/oauth-providers'
+
+export function OAuthButtons() {
+  return (
+    <Stack direction="row" spacing={1} justifyContent="center">
+      {oauthProviders.map((p) => (
+        <Button
+          key={p.id}
+          variant="outlined"
+          href={getOAuthUrl(p.id)}
+          sx={{
+            borderColor: p.color,
+            color: p.color,
+            '&:hover': {
+              borderColor: p.color,
+              bgcolor: `${p.color}14`,
+            },
+          }}
+        >
+          Войти через {p.label}
+        </Button>
+      ))}
+    </Stack>
+  )
+}