diff --git a/src/data-sources/components/AddDataSourceDropdown.tsx b/src/data-sources/components/AddDataSourceDropdown.tsx
index 070d2bca..7f5e1d31 100644
--- a/src/data-sources/components/AddDataSourceDropdown.tsx
+++ b/src/data-sources/components/AddDataSourceDropdown.tsx
@@ -25,11 +25,15 @@ export const AddDataSourceDropdown = () => {
 			className="rdb-settings-page_add-data-source-dropdown"
 			icon={ null }
 			label={ __( 'Connect new data source', 'remote-data-blocks' ) }
+			popoverProps={ {
+				offset: 8,
+			} }
 			text={ __( 'Connect New', 'remote-data-blocks' ) }
 			toggleProps={ {
 				className: 'rdb-settings-page_add-data-source-btn',
 				variant: 'primary',
 				showTooltip: false,
+				__next40pxDefaultSize: true,
 			} }
 			children={ ( { onClose } ) => (
 				<MenuGroup>
@@ -60,18 +64,19 @@ export const AddDataSourceDropdown = () => {
 							value: 'generic-http',
 						},
 					].map( ( { icon, label, value } ) => (
-						<MenuItem
-							className={ `rdb-settings-page_add-data-source-btn-${ value }` }
-							key={ value }
-							icon={ icon }
-							iconPosition="left"
-							onClick={ () => {
-								onAddDataSource( value );
-								onClose();
-							} }
-						>
-							{ label }
-						</MenuItem>
+						<div key={ value } className="rdb-settings-page_add-data-source-btn-wrapper">
+							<MenuItem
+								className={ `rdb-settings-page_add-data-source-btn-${ value }` }
+								icon={ icon }
+								iconPosition="left"
+								onClick={ () => {
+									onAddDataSource( value );
+									onClose();
+								} }
+							>
+								{ label }
+							</MenuItem>
+						</div>
 					) ) }
 				</MenuGroup>
 			) }
diff --git a/src/settings/icons/GoogleSheetsIcon.tsx b/src/settings/icons/GoogleSheetsIcon.tsx
index f190b005..4b81a1b4 100644
--- a/src/settings/icons/GoogleSheetsIcon.tsx
+++ b/src/settings/icons/GoogleSheetsIcon.tsx
@@ -1,15 +1,156 @@
 import { SVG } from '@wordpress/primitives';
 
 export const GoogleSheetsIcon: JSX.Element = (
-	<SVG width="24" height="24" viewBox="0 0 49 67" fill="none" xmlns="http://www.w3.org/2000/svg">
-		<path
-			d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z"
-			fill="#0F9D58"
-		/>
-		<path
-			d="M11.8333333,31.8020833 L11.8333333,53.25 L35.5,53.25 L35.5,31.8020833 L11.8333333,31.8020833 Z M22.1875,50.2916667 L14.7916667,50.2916667 L14.7916667,46.59375 L22.1875,46.59375 L22.1875,50.2916667 Z M22.1875,44.375 L14.7916667,44.375 L14.7916667,40.6770833 L22.1875,40.6770833 L22.1875,44.375 Z M22.1875,38.4583333 L14.7916667,38.4583333 L14.7916667,34.7604167 L22.1875,34.7604167 L22.1875,38.4583333 Z M32.5416667,50.2916667 L25.1458333,50.2916667 L25.1458333,46.59375 L32.5416667,46.59375 L32.5416667,50.2916667 Z M32.5416667,44.375 L25.1458333,44.375 L25.1458333,40.6770833 L32.5416667,40.6770833 L32.5416667,44.375 Z M32.5416667,38.4583333 L25.1458333,38.4583333 L25.1458333,34.7604167 L32.5416667,34.7604167 L32.5416667,38.4583333 Z"
-			fill="#F1F1F1"
-		/>
+	<SVG
+		width="49px"
+		height="67px"
+		viewBox="0 0 49 67"
+		version="1.1"
+		xmlns="http://www.w3.org/2000/svg"
+	>
+		<defs>
+			<path
+				d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z"
+				id="path-1"
+			></path>
+			<linearGradient
+				x1="50.0053945%"
+				y1="8.58610612%"
+				x2="50.0053945%"
+				y2="100.013939%"
+				id="linearGradient-7"
+			>
+				<stop stopColor="#263238" stopOpacity="0.2" offset="0%"></stop>
+				<stop stopColor="#263238" stopOpacity="0.02" offset="100%"></stop>
+			</linearGradient>
+			<radialGradient
+				cx="3.16804688%"
+				cy="2.71744318%"
+				fx="3.16804688%"
+				fy="2.71744318%"
+				r="161.248516%"
+				gradientTransform="translate(0.031680,0.027174),scale(1.000000,0.727273),translate(-0.031680,-0.027174)"
+				id="radialGradient-16"
+			>
+				<stop stopColor="#FFFFFF" stopOpacity="0.1" offset="0%"></stop>
+				<stop stopColor="#FFFFFF" stopOpacity="0" offset="100%"></stop>
+			</radialGradient>
+		</defs>
+		<g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+			<g id="Consumer-Apps-Sheets-Large-VD-R8-" transform="translate(-451.000000, -451.000000)">
+				<g id="Hero" transform="translate(0.000000, 63.000000)">
+					<g id="Personal" transform="translate(277.000000, 299.000000)">
+						<g id="Sheets-icon" transform="translate(174.833333, 89.958333)">
+							<g id="Group">
+								<g id="Clipped">
+									<mask id="mask-2" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<path
+										d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L36.9791667,10.3541667 L29.5833333,0 Z"
+										id="Path"
+										fill="#0F9D58"
+										fillRule="nonzero"
+										mask="url(#mask-2)"
+									></path>
+								</g>
+								<g id="Clipped">
+									<mask id="mask-4" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<path
+										d="M11.8333333,31.8020833 L11.8333333,53.25 L35.5,53.25 L35.5,31.8020833 L11.8333333,31.8020833 Z M22.1875,50.2916667 L14.7916667,50.2916667 L14.7916667,46.59375 L22.1875,46.59375 L22.1875,50.2916667 Z M22.1875,44.375 L14.7916667,44.375 L14.7916667,40.6770833 L22.1875,40.6770833 L22.1875,44.375 Z M22.1875,38.4583333 L14.7916667,38.4583333 L14.7916667,34.7604167 L22.1875,34.7604167 L22.1875,38.4583333 Z M32.5416667,50.2916667 L25.1458333,50.2916667 L25.1458333,46.59375 L32.5416667,46.59375 L32.5416667,50.2916667 Z M32.5416667,44.375 L25.1458333,44.375 L25.1458333,40.6770833 L32.5416667,40.6770833 L32.5416667,44.375 Z M32.5416667,38.4583333 L25.1458333,38.4583333 L25.1458333,34.7604167 L32.5416667,34.7604167 L32.5416667,38.4583333 Z"
+										id="Shape"
+										fill="#F1F1F1"
+										fillRule="nonzero"
+										mask="url(#mask-4)"
+									></path>
+								</g>
+								<g id="Clipped">
+									<mask id="mask-6" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<polygon
+										id="Path"
+										fill="url(#linearGradient-7)"
+										fillRule="nonzero"
+										mask="url(#mask-6)"
+										points="30.8813021 16.4520313 47.3333333 32.9003646 47.3333333 17.75"
+									></polygon>
+								</g>
+								<g id="Clipped">
+									<mask id="mask-9" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<g id="Group" mask="url(#mask-9)">
+										<g transform="translate(26.625000, -2.958333)">
+											<path
+												d="M2.95833333,2.95833333 L2.95833333,16.2708333 C2.95833333,18.7225521 4.94411458,20.7083333 7.39583333,20.7083333 L20.7083333,20.7083333 L2.95833333,2.95833333 Z"
+												id="Path"
+												fill="#87CEAC"
+												fillRule="nonzero"
+											></path>
+										</g>
+									</g>
+								</g>
+								<g id="Clipped">
+									<mask id="mask-11" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<path
+										d="M4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,4.80729167 C0,2.36666667 1.996875,0.369791667 4.4375,0.369791667 L29.5833333,0.369791667 L29.5833333,0 L4.4375,0 Z"
+										id="Path"
+										fillOpacity="0.2"
+										fill="#FFFFFF"
+										fillRule="nonzero"
+										mask="url(#mask-11)"
+									></path>
+								</g>
+								<g id="Clipped">
+									<mask id="mask-13" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<path
+										d="M42.8958333,64.7135417 L4.4375,64.7135417 C1.996875,64.7135417 0,62.7166667 0,60.2760417 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,60.2760417 C47.3333333,62.7166667 45.3364583,64.7135417 42.8958333,64.7135417 Z"
+										id="Path"
+										fillOpacity="0.2"
+										fill="#263238"
+										fillRule="nonzero"
+										mask="url(#mask-13)"
+									></path>
+								</g>
+								<g id="Clipped">
+									<mask id="mask-15" fill="white">
+										<use xlinkHref="#path-1"></use>
+									</mask>
+									<g id="SVGID_1_"></g>
+									<path
+										d="M34.0208333,17.75 C31.5691146,17.75 29.5833333,15.7642188 29.5833333,13.3125 L29.5833333,13.6822917 C29.5833333,16.1340104 31.5691146,18.1197917 34.0208333,18.1197917 L47.3333333,18.1197917 L47.3333333,17.75 L34.0208333,17.75 Z"
+										id="Path"
+										fillOpacity="0.1"
+										fill="#263238"
+										fillRule="nonzero"
+										mask="url(#mask-15)"
+									></path>
+								</g>
+							</g>
+							<path
+								d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z"
+								id="Path"
+								fill="url(#radialGradient-16)"
+								fillRule="nonzero"
+							></path>
+						</g>
+					</g>
+				</g>
+			</g>
+		</g>
 	</SVG>
 );
 
diff --git a/src/settings/index.scss b/src/settings/index.scss
index 9b1539f4..b2e16829 100644
--- a/src/settings/index.scss
+++ b/src/settings/index.scss
@@ -91,15 +91,18 @@ body {
 			padding: 24px 48px;
 			border-bottom: 1px solid var(--Alias-border-border-secondary, #ebebeb);
 
-
 			p {
 				margin-bottom: 0;
 			}
 
-
 			.rdb-settings-page_add-data-source-dropdown {
 				grid-area: 1 / 2 / span 1 / span 1;
 				justify-self: end;
+				align-self: center;
+
+				.rdb-settings-page_add-data-source-btn.is-opened {
+					background: #1d35b4;
+				}
 			}
 		}
 	}
@@ -107,18 +110,23 @@ body {
 	/* Add new source menu */
 	.components-menu-group {
 
-		div {
-			display: flex;
+		> div {
+			display: grid;
+			grid-template-columns: repeat(3, 1fr);
 			width: 368px;
-			align-items: flex-start;
-			align-content: flex-start;
+			align-items: start;
+			align-content: start;
 			gap: 8px;
 			padding: 8px 8px 16px 8px;
-			flex-wrap: wrap;
+
+			.rdb-settings-page_add-data-source-btn-wrapper {
+				height: 100%;
+			}
 
 			.components-button.has-icon.has-text {
 				display: flex;
 				width: 112px;
+				height: 101px;
 				padding: var(--Spacing-Spacing-Base, 16px);
 				flex-direction: column;
 				align-items: center;
@@ -130,16 +138,33 @@ body {
 
 				}
 
+				svg {
+					width: 40px;
+					height: 40px;
+					padding: 4px;
+				}
+
 				.components-menu-item__item {
 					min-width: unset;
 					margin-right: unset;
-					text-wrap: auto;
 					text-align: center;
 				}
 			}
 
-			.rdb-settings-page_add-data-source-btn-salesforce-b2c svg {
-				width: 50px;
+			.components-button.has-icon.has-text.rdb-settings-page_add-data-source-btn-generic-http svg {
+				padding: 8px;
+			}
+
+			.components-button.has-icon.has-text.rdb-settings-page_add-data-source-btn-salesforce-b2c {
+
+				svg {
+					padding: 0;
+				}
+
+				span.components-menu-item__item {
+					text-wrap: auto;
+					min-width: 112px;
+				}
 			}
 		}
 	}