diff --git a/packages/block-library/src/social-link/icons/index.js b/packages/block-library/src/social-link/icons/index.js
index 62c32d2d5f35c..85de13090ad5d 100644
--- a/packages/block-library/src/social-link/icons/index.js
+++ b/packages/block-library/src/social-link/icons/index.js
@@ -40,5 +40,6 @@ export * from './vimeo';
export * from './vk';
export * from './whatsapp';
export * from './wordpress';
+export * from './x';
export * from './yelp';
export * from './youtube';
diff --git a/packages/block-library/src/social-link/icons/x.js b/packages/block-library/src/social-link/icons/x.js
new file mode 100644
index 0000000000000..cd70775ad7cb8
--- /dev/null
+++ b/packages/block-library/src/social-link/icons/x.js
@@ -0,0 +1,10 @@
+/**
+ * WordPress dependencies
+ */
+import { Path, SVG } from '@wordpress/primitives';
+
+export const XIcon = () => (
+
+);
diff --git a/packages/block-library/src/social-link/index.php b/packages/block-library/src/social-link/index.php
index 1ce60ff49fb41..cda8e125097a5 100644
--- a/packages/block-library/src/social-link/index.php
+++ b/packages/block-library/src/social-link/index.php
@@ -238,6 +238,10 @@ function block_core_social_link_services( $service = '', $field = '' ) {
'name' => 'Reddit',
'icon' => '',
),
+ 'share' => array(
+ 'name' => 'Share Icon',
+ 'icon' => '',
+ ),
'skype' => array(
'name' => 'Skype',
'icon' => '',
@@ -294,6 +298,10 @@ function block_core_social_link_services( $service = '', $field = '' ) {
'name' => 'WhatsApp',
'icon' => '',
),
+ 'x' => array(
+ 'name' => 'X',
+ 'icon' => '',
+ ),
'yelp' => array(
'name' => 'Yelp',
'icon' => '',
@@ -302,10 +310,6 @@ function block_core_social_link_services( $service = '', $field = '' ) {
'name' => 'YouTube',
'icon' => '',
),
- 'share' => array(
- 'name' => 'Share Icon',
- 'icon' => '',
- ),
);
if ( ! empty( $service )
diff --git a/packages/block-library/src/social-link/socials-with-bg.scss b/packages/block-library/src/social-link/socials-with-bg.scss
index 042db464f6ee2..3ee9b4b5148a8 100644
--- a/packages/block-library/src/social-link/socials-with-bg.scss
+++ b/packages/block-library/src/social-link/socials-with-bg.scss
@@ -199,6 +199,11 @@
color: #fff;
}
+.wp-social-link-x {
+ background-color: #000;
+ color: #fff;
+}
+
.wp-social-link-yelp {
background-color: #d32422;
color: #fff;
diff --git a/packages/block-library/src/social-link/socials-without-bg.scss b/packages/block-library/src/social-link/socials-without-bg.scss
index ea8fca5d7ab83..aa84b5ab1433c 100644
--- a/packages/block-library/src/social-link/socials-without-bg.scss
+++ b/packages/block-library/src/social-link/socials-without-bg.scss
@@ -155,6 +155,10 @@
color: #3499cd;
}
+.wp-social-link-x {
+ color: #000;
+}
+
.wp-social-link-yelp {
color: #d32422;
}
diff --git a/packages/block-library/src/social-link/variations.js b/packages/block-library/src/social-link/variations.js
index 47307ca65c088..5b03b85ae4e60 100644
--- a/packages/block-library/src/social-link/variations.js
+++ b/packages/block-library/src/social-link/variations.js
@@ -44,6 +44,7 @@ import {
VkIcon,
WhatsAppIcon,
WordPressIcon,
+ XIcon,
YelpIcon,
YouTubeIcon,
} from './icons';
@@ -304,6 +305,13 @@ const variations = [
title: 'WhatsApp',
icon: WhatsAppIcon,
},
+ {
+ name: 'x',
+ attributes: { service: 'x' },
+ keywords: [ 'twitter' ],
+ title: 'X',
+ icon: XIcon,
+ },
{
name: 'yelp',
attributes: { service: 'yelp' },
diff --git a/test/integration/fixtures/blocks/core__social-link-x.html b/test/integration/fixtures/blocks/core__social-link-x.html
new file mode 100644
index 0000000000000..a587f2d0962f6
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__social-link-x.html
@@ -0,0 +1 @@
+
diff --git a/test/integration/fixtures/blocks/core__social-link-x.json b/test/integration/fixtures/blocks/core__social-link-x.json
new file mode 100644
index 0000000000000..d0cf492d2aa03
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__social-link-x.json
@@ -0,0 +1,11 @@
+[
+ {
+ "name": "core/social-link",
+ "isValid": true,
+ "attributes": {
+ "url": "https://example.com/",
+ "service": "x"
+ },
+ "innerBlocks": []
+ }
+]
diff --git a/test/integration/fixtures/blocks/core__social-link-x.parsed.json b/test/integration/fixtures/blocks/core__social-link-x.parsed.json
new file mode 100644
index 0000000000000..2119720f5db0f
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__social-link-x.parsed.json
@@ -0,0 +1,11 @@
+[
+ {
+ "blockName": "core/social-link-x",
+ "attrs": {
+ "url": "https://example.com/"
+ },
+ "innerBlocks": [],
+ "innerHTML": "",
+ "innerContent": []
+ }
+]
diff --git a/test/integration/fixtures/blocks/core__social-link-x.serialized.html b/test/integration/fixtures/blocks/core__social-link-x.serialized.html
new file mode 100644
index 0000000000000..be00807af4c9e
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__social-link-x.serialized.html
@@ -0,0 +1 @@
+