chore: added new social and logo icons

deriv-com · Nov 10, 2023 · 30524f6 · 30524f6
1 parent a8be50d
commit 30524f6
Show file tree

Hide file tree

Showing 102 changed files with 1,742 additions and 324 deletions.
diff --git a/src/react/Social/SocialAppleIcon.tsx → src/react/Social/SocialAppleBlackIcon.tsx b/src/react/Social/SocialAppleIcon.tsx → src/react/Social/SocialAppleBlackIcon.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Ref, forwardRef } from 'react';
 import { QuillSvgProps, sizes } from 'types';
-export const SocialAppleIcon = (
+export const SocialAppleBlackIcon = (
   { iconSize = 'md', ...props }: QuillSvgProps,
   ref: Ref<SVGSVGElement>,
 ) => (
@@ -24,5 +24,5 @@ export const SocialAppleIcon = (
     </defs>
   </svg>
 );
-const ForwardRef = forwardRef(SocialAppleIcon);
+const ForwardRef = forwardRef(SocialAppleBlackIcon);
 export default ForwardRef;
diff --git a/src/react/Social/SocialAppleWhiteIcon.tsx b/src/react/Social/SocialAppleWhiteIcon.tsx
@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialAppleWhiteIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g fill='#fff' clipPath='url(#a)'>
+      <path d='M22.248 0c.195 1.894-.542 3.749-1.627 5.129-1.125 1.34-2.907 2.405-4.69 2.248-.233-1.815.66-3.746 1.667-4.93C18.721 1.066 20.66.08 22.248 0ZM18.064 8.672c1.158-.464 2.59-1.038 4.165-.943 1.006.08 3.904.395 5.76 3.185l-.06.041c-.476.317-3.378 2.248-3.342 6.057.036 4.537 3.678 6.238 4.16 6.463a.52.52 0 0 1 .053.026l-.01.032c-.092.3-.72 2.36-2.153 4.49-1.315 1.97-2.668 3.896-4.833 3.935-1.02.02-1.706-.28-2.422-.592-.75-.326-1.53-.667-2.757-.667-1.286 0-2.104.351-2.891.69-.68.29-1.336.572-2.25.61-2.087.077-3.67-2.087-4.985-4.053-2.707-3.973-4.755-11.21-1.971-16.088C5.88 9.42 8.354 7.887 11.02 7.847c1.164-.022 2.278.426 3.25.816.739.297 1.396.562 1.93.562.485 0 1.118-.254 1.864-.553Z' />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialAppleWhiteIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialFacebookBlackIcon.tsx b/src/react/Social/SocialFacebookBlackIcon.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialFacebookBlackIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g clipPath='url(#a)'>
+      <path
+        fill='#000'
+        fillRule='evenodd'
+        d='M16 32c8.837 0 16-7.163 16-16S24.837 0 16 0 0 7.163 0 16s7.163 16 16 16Zm2.5-11.249v11.055a16.121 16.121 0 0 1-5 0V20.75H9.437v-4.653H13.5V12.55c0-4.034 2.389-6.263 6.043-6.263 1.751 0 3.582.315 3.582.315v3.961h-2.018c-1.987 0-2.607 1.241-2.607 2.514v3.02h4.438l-.71 4.653H18.5Z'
+        clipRule='evenodd'
+      />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialFacebookBlackIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialFacebookBrandDarkIcon.tsx b/src/react/Social/SocialFacebookBrandDarkIcon.tsx
@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialFacebookBrandDarkIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g clipPath='url(#a)'>
+      <path
+        fill='#fff'
+        fillRule='evenodd'
+        d='M16 32c8.837 0 16-7.163 16-16S24.837 0 16 0 0 7.163 0 16s7.163 16 16 16Zm2.5-11.249v11.055a16.121 16.121 0 0 1-5 0V20.75H9.437v-4.653H13.5V12.55c0-4.034 2.389-6.263 6.043-6.263 1.751 0 3.582.315 3.582.315v3.961h-2.018c-1.987 0-2.607 1.241-2.607 2.514v3.02h4.438l-.71 4.653H18.5Z'
+        clipRule='evenodd'
+      />
+      <path
+        fill='#1877F2'
+        d='M18.5 20.751v11.055a16.121 16.121 0 0 1-5 0V20.75H9.437v-4.653H13.5V12.55c0-4.034 2.389-6.263 6.043-6.263 1.751 0 3.582.315 3.582.315v3.961h-2.018c-1.987 0-2.607 1.241-2.607 2.514v3.02h4.438l-.71 4.653H18.5Z'
+      />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialFacebookBrandDarkIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialFacebookBrandIcon.tsx b/src/react/Social/SocialFacebookBrandIcon.tsx
@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialFacebookBrandIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g clipPath='url(#a)'>
+      <path
+        fill='#1877F2'
+        fillRule='evenodd'
+        d='M16 32c8.837 0 16-7.163 16-16S24.837 0 16 0 0 7.163 0 16s7.163 16 16 16Zm2.5-11.249v11.055a16.121 16.121 0 0 1-5 0V20.75H9.437v-4.653H13.5V12.55c0-4.034 2.389-6.263 6.043-6.263 1.751 0 3.582.315 3.582.315v3.961h-2.018c-1.987 0-2.607 1.241-2.607 2.514v3.02h4.438l-.71 4.653H18.5Z'
+        clipRule='evenodd'
+      />
+      <path
+        fill='#fff'
+        d='M18.5 20.751v11.055a16.121 16.121 0 0 1-5 0V20.75H9.437v-4.653H13.5V12.55c0-4.034 2.389-6.263 6.043-6.263 1.751 0 3.582.315 3.582.315v3.961h-2.018c-1.987 0-2.607 1.241-2.607 2.514v3.02h4.438l-.71 4.653H18.5Z'
+      />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialFacebookBrandIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialFacebookWhiteIcon.tsx b/src/react/Social/SocialFacebookWhiteIcon.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialFacebookWhiteIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g clipPath='url(#a)'>
+      <path
+        fill='#fff'
+        fillRule='evenodd'
+        d='M16 32c8.837 0 16-7.163 16-16S24.837 0 16 0 0 7.163 0 16s7.163 16 16 16Zm2.5-11.249v11.055a16.121 16.121 0 0 1-5 0V20.75H9.437v-4.653H13.5V12.55c0-4.034 2.389-6.263 6.043-6.263 1.751 0 3.582.315 3.582.315v3.961h-2.018c-1.987 0-2.607 1.241-2.607 2.514v3.02h4.438l-.71 4.653H18.5Z'
+        clipRule='evenodd'
+      />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialFacebookWhiteIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialGoogleBlackIcon.tsx b/src/react/Social/SocialGoogleBlackIcon.tsx
@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialGoogleBlackIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g clipPath='url(#a)'>
+      <path
+        fill='#000'
+        d='M1.733 8.819c2.77-5.404 8.42-8.82 14.594-8.82 4.402 0 8.099 1.583 10.924 4.163l-4.687 4.594c-1.688-1.582-3.843-2.392-6.237-2.392-4.256 0-7.852 2.814-9.137 6.6a9.351 9.351 0 0 0 0 6.082l.001-.002c1.284 3.785 4.88 6.6 9.136 6.6 2.201 0 4.072-.567 5.53-1.53l.18.137-.182-.138a7.341 7.341 0 0 0 3.256-4.828h-8.787V13.1h15.382c.193 1.078.294 2.175.294 3.272 0 4.873-1.78 8.972-4.87 11.76l-.004-.003c-2.696 2.443-6.39 3.87-10.8 3.87-6.17.01-11.82-3.406-14.59-8.807l-.003.002a15.768 15.768 0 0 1 0-14.375Z'
+      />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialGoogleBlackIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialGoogleIcon.tsx → src/react/Social/SocialGoogleBrandIcon.tsx b/src/react/Social/SocialGoogleIcon.tsx → src/react/Social/SocialGoogleBrandIcon.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Ref, forwardRef } from 'react';
 import { QuillSvgProps, sizes } from 'types';
-export const SocialGoogleIcon = (
+export const SocialGoogleBrandIcon = (
   { iconSize = 'md', ...props }: QuillSvgProps,
   ref: Ref<SVGSVGElement>,
 ) => (
@@ -17,19 +17,19 @@ export const SocialGoogleIcon = (
     <g clipPath='url(#a)'>
       <path
         fill='#3E82F1'
-        d='M32 16.373c0-1.097-.1-2.194-.294-3.273H16.325v6.185h8.787a7.342 7.342 0 0 1-3.256 4.828l5.274 4.019c3.09-2.787 4.87-6.887 4.87-11.76Z'
+        d='M32 16.375c0-1.097-.1-2.194-.294-3.273H16.325v6.186h8.787a7.343 7.343 0 0 1-3.256 4.829l5.274 4.02C30.22 25.348 32 21.248 32 16.374Z'
       />
       <path
         fill='#32A753'
-        d='M21.858 24.115c-1.458.962-3.33 1.529-5.53 1.529-4.257 0-7.852-2.814-9.136-6.6L1.734 23.19c2.77 5.404 8.42 8.82 14.593 8.811 4.412 0 8.108-1.43 10.805-3.875l-5.274-4.01Z'
+        d='M21.858 24.119c-1.458.962-3.33 1.529-5.53 1.529-4.257 0-7.852-2.815-9.136-6.6l-5.458 4.145c2.77 5.404 8.42 8.82 14.593 8.812 4.412 0 8.108-1.43 10.805-3.876l-5.274-4.01Z'
       />
       <path
         fill='#F9BB00'
-        d='M7.19 12.964 1.735 8.819a15.768 15.768 0 0 0 0 14.376L7.19 19.05a9.351 9.351 0 0 1 0-6.086Z'
+        d='M7.19 12.966 1.735 8.82a15.773 15.773 0 0 0 0 14.377l5.457-4.145a9.354 9.354 0 0 1 0-6.087Z'
       />
       <path
         fill='#E74133'
-        d='M16.327 0C10.154 0 4.503 3.416 1.734 8.82l5.457 4.144c1.284-3.785 4.88-6.599 9.136-6.599 2.394 0 4.55.81 6.237 2.392l4.687-4.594C24.426 1.583 20.73 0 16.327 0Z'
+        d='M16.327 0C10.154 0 4.503 3.417 1.734 8.82l5.457 4.146c1.284-3.786 4.88-6.6 9.136-6.6 2.394 0 4.55.81 6.237 2.392l4.687-4.595C24.426 1.583 20.73 0 16.327 0Z'
       />
     </g>
     <defs>
@@ -39,5 +39,5 @@ export const SocialGoogleIcon = (
     </defs>
   </svg>
 );
-const ForwardRef = forwardRef(SocialGoogleIcon);
+const ForwardRef = forwardRef(SocialGoogleBrandIcon);
 export default ForwardRef;
diff --git a/src/react/Social/SocialGoogleWhiteIcon.tsx b/src/react/Social/SocialGoogleWhiteIcon.tsx
@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialGoogleWhiteIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g clipPath='url(#a)'>
+      <path
+        fill='#fff'
+        d='M1.733 8.819c2.77-5.404 8.42-8.82 14.594-8.82 4.402 0 8.099 1.583 10.924 4.163l-4.687 4.594c-1.688-1.582-3.843-2.392-6.237-2.392-4.256 0-7.852 2.814-9.137 6.6a9.351 9.351 0 0 0 0 6.082l.001-.002c1.284 3.785 4.88 6.6 9.136 6.6 2.201 0 4.072-.567 5.53-1.53l.18.137-.182-.138a7.341 7.341 0 0 0 3.256-4.828h-8.787V13.1h15.382c.193 1.078.294 2.175.294 3.272 0 4.873-1.78 8.972-4.87 11.76l-.004-.003c-2.696 2.443-6.39 3.87-10.8 3.87-6.17.01-11.82-3.406-14.59-8.807l-.003.002a15.768 15.768 0 0 1 0-14.375Z'
+      />
+    </g>
+    <defs>
+      <clipPath id='a'>
+        <path fill='#fff' d='M0 0h32v32H0z' />
+      </clipPath>
+    </defs>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialGoogleWhiteIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialInstagramBlackIcon.tsx b/src/react/Social/SocialInstagramBlackIcon.tsx
@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialInstagramBlackIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g fill='#000'>
+      <path d='M26.462 7.46a1.922 1.922 0 1 0-3.844 0 1.922 1.922 0 0 0 3.844 0Z' />
+      <path d='M29.022 22.465c-.071 1.56-.332 2.407-.549 2.97a4.943 4.943 0 0 1-1.2 1.84c-.558.56-1.091.907-1.838 1.194-.563.22-1.413.482-2.974.556-1.686.075-2.186.09-6.463.09-4.273 0-4.777-.015-6.463-.09-1.56-.074-2.407-.336-2.97-.556a4.894 4.894 0 0 1-1.84-1.194 4.877 4.877 0 0 1-1.198-1.84c-.217-.563-.482-1.41-.55-2.97-.081-1.687-.096-2.195-.096-6.463 0-4.277.015-4.78.097-6.467.067-1.56.332-2.407.549-2.975a4.869 4.869 0 0 1 1.198-1.836 4.95 4.95 0 0 1 1.84-1.197c.563-.22 1.41-.479 2.97-.553 1.686-.074 2.19-.093 6.463-.093 4.277 0 4.777.019 6.463.093 1.56.074 2.411.332 2.974.553.747.29 1.28.638 1.837 1.197.563.56.91 1.09 1.201 1.836.217.568.478 1.415.55 2.975.077 1.686.096 2.19.096 6.467 0 4.268-.019 4.776-.097 6.463Zm2.88-13.062c-.078-1.704-.346-2.87-.746-3.884a7.8 7.8 0 0 0-1.843-2.836A7.867 7.867 0 0 0 26.481.839C25.462.444 24.3.172 22.596.097 20.89.015 20.346 0 15.998 0 11.655 0 11.106.015 9.4.097 7.7.172 6.54.444 5.515.84a7.887 7.887 0 0 0-2.828 1.844A7.862 7.862 0 0 0 .84 5.519C.444 6.534.176 7.7.093 9.403.02 11.11 0 11.655 0 16.002c0 4.344.019 4.888.093 6.594.083 1.701.351 2.865.747 3.885a7.848 7.848 0 0 0 1.847 2.832 7.884 7.884 0 0 0 2.828 1.847c1.024.396 2.184.665 3.885.743 1.706.078 2.255.097 6.598.097 4.347 0 4.892-.019 6.598-.097 1.705-.078 2.866-.347 3.885-.743a7.865 7.865 0 0 0 2.832-1.847 7.786 7.786 0 0 0 1.843-2.832c.4-1.02.668-2.184.747-3.885.078-1.706.097-2.25.097-6.594 0-4.347-.019-4.893-.097-6.599Z' />
+      <path d='M15.998 21.33a5.33 5.33 0 0 1-5.332-5.328 5.334 5.334 0 1 1 10.67 0 5.334 5.334 0 0 1-5.338 5.329Zm0-13.55c-4.538 0-8.213 3.684-8.213 8.222a8.213 8.213 0 0 0 8.213 8.213c4.538 0 8.218-3.679 8.218-8.213 0-4.538-3.68-8.221-8.218-8.221Z' />
+    </g>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialInstagramBlackIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialInstagramIcon.tsx → ...react/Social/SocialInstagramBrandIcon.tsx b/src/react/Social/SocialInstagramIcon.tsx → ...react/Social/SocialInstagramBrandIcon.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Ref, forwardRef } from 'react';
 import { QuillSvgProps, sizes } from 'types';
-export const SocialInstagramIcon = (
+export const SocialInstagramBrandIcon = (
   { iconSize = 'md', ...props }: QuillSvgProps,
   ref: Ref<SVGSVGElement>,
 ) => (
@@ -72,5 +72,5 @@ export const SocialInstagramIcon = (
     </defs>
   </svg>
 );
-const ForwardRef = forwardRef(SocialInstagramIcon);
+const ForwardRef = forwardRef(SocialInstagramBrandIcon);
 export default ForwardRef;
diff --git a/src/react/Social/SocialInstagramWhiteIcon.tsx b/src/react/Social/SocialInstagramWhiteIcon.tsx
@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialInstagramWhiteIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <g fill='#fff'>
+      <path d='M26.462 7.46a1.922 1.922 0 1 0-3.844 0 1.922 1.922 0 0 0 3.844 0Z' />
+      <path d='M29.022 22.465c-.071 1.56-.332 2.407-.549 2.97a4.943 4.943 0 0 1-1.2 1.84c-.558.56-1.091.907-1.838 1.194-.563.22-1.413.482-2.974.556-1.686.075-2.186.09-6.463.09-4.273 0-4.777-.015-6.463-.09-1.56-.074-2.407-.336-2.97-.556a4.894 4.894 0 0 1-1.84-1.194 4.877 4.877 0 0 1-1.198-1.84c-.217-.563-.482-1.41-.55-2.97-.081-1.687-.096-2.195-.096-6.463 0-4.277.015-4.78.097-6.467.067-1.56.332-2.407.549-2.975a4.869 4.869 0 0 1 1.198-1.836 4.95 4.95 0 0 1 1.84-1.197c.563-.22 1.41-.479 2.97-.553 1.686-.074 2.19-.093 6.463-.093 4.277 0 4.777.019 6.463.093 1.56.074 2.411.332 2.974.553.747.29 1.28.638 1.837 1.197.563.56.91 1.09 1.201 1.836.217.568.478 1.415.55 2.975.077 1.686.096 2.19.096 6.467 0 4.268-.019 4.776-.097 6.463Zm2.88-13.062c-.078-1.704-.346-2.87-.746-3.884a7.8 7.8 0 0 0-1.843-2.836A7.867 7.867 0 0 0 26.481.839C25.462.444 24.3.172 22.596.097 20.89.015 20.346 0 15.998 0 11.655 0 11.106.015 9.4.097 7.7.172 6.54.444 5.515.84a7.887 7.887 0 0 0-2.828 1.844A7.862 7.862 0 0 0 .84 5.519C.444 6.534.176 7.7.093 9.403.02 11.11 0 11.655 0 16.002c0 4.344.019 4.888.093 6.594.083 1.701.351 2.865.747 3.885a7.848 7.848 0 0 0 1.847 2.832 7.884 7.884 0 0 0 2.828 1.847c1.024.396 2.184.665 3.885.743 1.706.078 2.255.097 6.598.097 4.347 0 4.892-.019 6.598-.097 1.705-.078 2.866-.347 3.885-.743a7.865 7.865 0 0 0 2.832-1.847 7.786 7.786 0 0 0 1.843-2.832c.4-1.02.668-2.184.747-3.885.078-1.706.097-2.25.097-6.594 0-4.347-.019-4.893-.097-6.599Z' />
+      <path d='M15.998 21.33a5.33 5.33 0 0 1-5.332-5.328 5.334 5.334 0 1 1 10.67 0 5.334 5.334 0 0 1-5.338 5.329Zm0-13.55c-4.538 0-8.213 3.684-8.213 8.222a8.213 8.213 0 0 0 8.213 8.213c4.538 0 8.218-3.679 8.218-8.213 0-4.538-3.68-8.221-8.218-8.221Z' />
+    </g>
+  </svg>
+);
+const ForwardRef = forwardRef(SocialInstagramWhiteIcon);
+export default ForwardRef;
diff --git a/src/react/Social/SocialLinkedinBlackIcon.tsx b/src/react/Social/SocialLinkedinBlackIcon.tsx
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { Ref, forwardRef } from 'react';
+import { QuillSvgProps, sizes } from 'types';
+export const SocialLinkedinBlackIcon = (
+  { iconSize = 'md', ...props }: QuillSvgProps,
+  ref: Ref<SVGSVGElement>,
+) => (
+  <svg
+    xmlns='http://www.w3.org/2000/svg'
+    fill='none'
+    viewBox='0 0 32 32'
+    {...sizes[iconSize]}
+    role='img'
+    ref={ref}
+    {...props}
+  >
+    <path
+      fill='#000'
+      fillRule='evenodd'
+      d='M2.412 0h27.27A2.294 2.294 0 0 1 32 2.302v27.394C32 30.968 30.607 32 29.301 32H2.031C.727 32 0 30.968 0 29.696V2.302C0 1.032 1.108 0 2.412 0Zm17.744 16c-2.299 0-3.394 1.556-3.394 4.11v7.318H12.19V12.19h4.307v2.197h.048C17.203 13.202 19.142 12 21.54 12c4.604 0 5.888 2.444 5.888 6.971v8.457h-4.57v-7.623c0-2.026-.81-3.805-2.702-3.805ZM9.714 6.857a2.865 2.865 0 0 1-.836 2.02 2.866 2.866 0 0 1-2.02.838A2.862 2.862 0 0 1 4.22 7.952a2.849 2.849 0 0 1 .619-3.113 2.856 2.856 0 0 1 4.876 2.018Zm-.571 20.571H4.572V12.19h4.57v15.238Z'
+      clipRule='evenodd'
+    />
+  </svg>
+);
+const ForwardRef = forwardRef(SocialLinkedinBlackIcon);
+export default ForwardRef;