diff --git a/src/components/button/XButton.tsx b/src/components/button/XButton.tsx
new file mode 100644
index 0000000..a933130
--- /dev/null
+++ b/src/components/button/XButton.tsx
@@ -0,0 +1,13 @@
+import XIcon from "@mui/icons-material/X";
+import { useTranslation } from "react-i18next";
+import { SocialButton } from "./SocialButton";
+
+interface XButtonProps {
+ disableSpacing?: boolean;
+ url: string;
+}
+
+export function XButton(props: XButtonProps) {
+ const { t } = useTranslation();
+ return } disableSpacing={props.disableSpacing} url={props.url} />;
+}
diff --git a/src/components/button/__tests__/XButton.test.tsx b/src/components/button/__tests__/XButton.test.tsx
new file mode 100644
index 0000000..184fd5c
--- /dev/null
+++ b/src/components/button/__tests__/XButton.test.tsx
@@ -0,0 +1,10 @@
+import { render } from "@testing-library/react";
+import { XButton } from "../XButton";
+import { usingTestingI18nContext } from "../../../jest/TestContextWrapper";
+
+describe("XButton", () => {
+ it("should match the snapshot", () => {
+ const { getByTestId } = render(usingTestingI18nContext().wrapper);
+ expect(getByTestId("x-button")).toMatchSnapshot();
+ });
+});
diff --git a/src/components/button/__tests__/__snapshots__/XButton.test.tsx.snap b/src/components/button/__tests__/__snapshots__/XButton.test.tsx.snap
new file mode 100644
index 0000000..2ee8f75
--- /dev/null
+++ b/src/components/button/__tests__/__snapshots__/XButton.test.tsx.snap
@@ -0,0 +1,28 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`XButton should match the snapshot 1`] = `
+
+`;
diff --git a/src/components/button/index.ts b/src/components/button/index.ts
index 7a10876..2444907 100644
--- a/src/components/button/index.ts
+++ b/src/components/button/index.ts
@@ -2,3 +2,4 @@ export { ExternalLinkButton } from "./ExternalLinkButton";
export { GitHubButton } from "./GitHubButton";
export { LinkedInButton } from "./LinkedInButton";
export { TwitterButton } from "./TwitterButton";
+export { XButton } from "./XButton";
diff --git a/src/components/social/SocialBar.tsx b/src/components/social/SocialBar.tsx
index 2b57b96..388ef9c 100644
--- a/src/components/social/SocialBar.tsx
+++ b/src/components/social/SocialBar.tsx
@@ -1,6 +1,6 @@
import Grid from "@mui/material/Grid";
import { SxProps, Theme } from "@mui/system";
-import { GitHubButton, LinkedInButton, TwitterButton } from "../button";
+import { GitHubButton, LinkedInButton, XButton } from "../button";
interface SocialBarProps {
sx?: SxProps;
@@ -18,7 +18,7 @@ export function SocialBar(props: SocialBarProps) {
-
+
diff --git a/src/pages/About/__tests__/__snapshots__/AboutPage.test.tsx.snap b/src/pages/About/__tests__/__snapshots__/AboutPage.test.tsx.snap
index ee57994..6b419ff 100644
--- a/src/pages/About/__tests__/__snapshots__/AboutPage.test.tsx.snap
+++ b/src/pages/About/__tests__/__snapshots__/AboutPage.test.tsx.snap
@@ -171,23 +171,23 @@ exports[`AboutPage should match the snapshot 1`] = `
target="_blank"
>