diff --git a/packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v10-info.mdx b/packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v10-info.mdx
index 90e5843063e..b489e192e02 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v10-info.mdx
+++ b/packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v10-info.mdx
@@ -35,6 +35,8 @@ import { Accordion } from '@dnb/eufemia/src'
     - [FormRow](#formrow)
   - [Element changes](#element-changes)
     - [Paragraph](#paragraph)
+  - [Extension changes](#extension-changes)
+    - [PaymentCard](#paymentcard)
 
 </Accordion>
 
@@ -298,4 +300,11 @@ Removed `small` as prop. Use `size="small"` instead.
 
 1. Find the `small ` property and replace it with `size="small"`.
 
+## Extension changes
+
+### [PaymentCard](/uilib/extensions/payment-card/)
+
+1. `Type`'s value/option `Metalic` was renamed to `Metallic`. Find `Metalic` and replace with `Metallic`.
+2. `Type`'s value/option `BlackMetalic` was renamed to `BlackMetallic`. Find `BlackMetalic` and replace with `BlackMetallic`.
+
 _April, 20. 2023_
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/CardProductsTable.js b/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/CardProductsTable.js
index 62773d77df1..dc6f32d4f30 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/CardProductsTable.js
+++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/CardProductsTable.js
@@ -71,5 +71,5 @@ const getProductVariant = (type, design) =>
 const getProductLogo = (bankLogo) =>
   bankLogo.cata({
     Colored: (color) => color,
-    Metalic: () => 'Metalic',
+    Metallic: () => 'Metallic',
   })
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/properties.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/properties.mdx
index f71f157845d..d54b41856f8 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/properties.mdx
+++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/properties.mdx
@@ -29,16 +29,16 @@ showTabs: true
 
 ## Card Design
 
-| Properties       | Type         | Description                                                                                                                                                                 |
-| ---------------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `name`           | `string`     | _(required)_ string Name of design                                                                                                                                          |
-| `cardStyle`      | `string`     | _(required)_ css class. mainly to set background and color                                                                                                                  |
-| `bankLogo`       | `Union Type` | _(required)_ Union Type. import DNB from ./card/utils/Types to use. Can be DNB.Colored('HexValue') or DNB.Metalic                                                           |
-| `visa`           | `Union Type` | _(required)_ Union Type. import Visa from ./card/utils/Types to use. Can be Visa.Colored('HexValue') or Visa.Metalic                                                        |
-| `mastercard`     | `Union Type` | _(required)_ Union Type. import Mastercard from ./card/utils/Types to use. Can be Mastercard.Default, Mastercard.DefaultWhite Mastercard.Metalic or Mastercard.MetalicBlack |
-| `bankAxept`      | `Union Type` | _(required)_ Union Type. import BankAxept from ./card/utils/Types to use. Can be BankAxept.White or BankAxept.Black                                                         |
-| `saga`           | `Union Type` | _(required)_ Union Type. import Saga from ./card/utils/Types to use. Can be Saga.Gold, Saga.Platinum, Saga.VisaPlatinum, or Saga.None                                       |
-| `privateBanking` | `Union Type` | _(required)_ Union Type. import PB from ./card/utils/Types to use. Can be PB.Default, PB.Platinum or PB.None                                                                |
+| Properties       | Type         | Description                                                                                                                                                                   |
+| ---------------- | ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `name`           | `string`     | _(required)_ string Name of design                                                                                                                                            |
+| `cardStyle`      | `string`     | _(required)_ css class. mainly to set background and color                                                                                                                    |
+| `bankLogo`       | `Union Type` | _(required)_ Union Type. import DNB from ./card/utils/Types to use. Can be DNB.Colored('HexValue') or DNB.Metallic                                                            |
+| `visa`           | `Union Type` | _(required)_ Union Type. import Visa from ./card/utils/Types to use. Can be Visa.Colored('HexValue') or Visa.Metallic                                                         |
+| `mastercard`     | `Union Type` | _(required)_ Union Type. import Mastercard from ./card/utils/Types to use. Can be Mastercard.Default, Mastercard.DefaultWhite Mastercard.Metallic or Mastercard.MetallicBlack |
+| `bankAxept`      | `Union Type` | _(required)_ Union Type. import BankAxept from ./card/utils/Types to use. Can be BankAxept.White or BankAxept.Black                                                           |
+| `saga`           | `Union Type` | _(required)_ Union Type. import Saga from ./card/utils/Types to use. Can be Saga.Gold, Saga.Platinum, Saga.VisaPlatinum, or Saga.None                                         |
+| `privateBanking` | `Union Type` | _(required)_ Union Type. import PB from ./card/utils/Types to use. Can be PB.Default, PB.Platinum or PB.None                                                                  |
 
 ## List of designs
 
@@ -63,7 +63,7 @@ showTabs: true
 | ---------------- |
 | **DNB**          |
 | `Colored`        |
-| `Metalic`        |
+| `Metallic`       |
 | **Saga**         |
 | `Gold`           |
 | `Platinum`       |
@@ -76,8 +76,8 @@ showTabs: true
 | **Mastercard**   |
 | `Default`        |
 | `DefaultWhite`   |
-| `Metalic`        |
-| `BlackMetalic`   |
+| `Metallic`       |
+| `BlackMetallic`  |
 | **ProductType**  |
 | `BankAxept`      |
 | `Saga`           |
@@ -92,7 +92,7 @@ showTabs: true
 | `Black`          |
 | **Visa**         |
 | `Colored`        |
-| `Metalic`        |
+| `Metallic`       |
 | **Status**       |
 | `Expired`        |
 | `Blocked`        |
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetalic.d.ts b/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetallic.d.ts
similarity index 57%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetalic.d.ts
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetallic.d.ts
index 0e861465c66..f84c9c73dc6 100644
--- a/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetalic.d.ts
+++ b/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetallic.d.ts
@@ -1,5 +1,5 @@
 import * as React from 'react';
-export interface DNBMetalicLogoSVGProps
+export interface DNBMetallicLogoSVGProps
   extends React.HTMLProps<HTMLElement> {
   /**
    * function fill() { [native code] }
@@ -9,5 +9,5 @@ export interface DNBMetalicLogoSVGProps
   height?: string;
   viewBox?: string;
 }
-declare const DNBMetalicLogoSVG: React.FC<DNBMetalicLogoSVGProps>;
-export default DNBMetalicLogoSVG;
+declare const DNBMetallicLogoSVG: React.FC<DNBMetallicLogoSVGProps>;
+export default DNBMetallicLogoSVG;
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetalic.js b/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetallic.js
similarity index 93%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetalic.js
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetallic.js
index e62d6609cf9..727522e4d5e 100644
--- a/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetalic.js
+++ b/packages/dnb-eufemia/src/extensions/payment-card/icons/DNBMetallic.js
@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-const DNBMetalicLogoSVG = (props) => (
+const DNBMetallicLogoSVG = (props) => (
   <svg {...props} fill="none" xmlns="http://www.w3.org/2000/svg">
     <title>DNB logo</title>
     <path
@@ -31,17 +31,17 @@ const DNBMetalicLogoSVG = (props) => (
     </defs>
   </svg>
 )
-DNBMetalicLogoSVG.propTypes = {
+DNBMetallicLogoSVG.propTypes = {
   fill: PropTypes.string,
   width: PropTypes.string,
   height: PropTypes.string,
-  viewBox: PropTypes.string
+  viewBox: PropTypes.string,
 }
-DNBMetalicLogoSVG.defaultProps = {
+DNBMetallicLogoSVG.defaultProps = {
   fill: 'none',
   width: '56',
   height: '38',
-  viewBox: '0 0 56 38'
+  viewBox: '0 0 56 38',
 }
 
-export default DNBMetalicLogoSVG
+export default DNBMetallicLogoSVG
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalic.d.ts b/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallic.d.ts
similarity index 100%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalic.d.ts
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallic.d.ts
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalic.js b/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallic.js
similarity index 100%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalic.js
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallic.js
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalicBlack.d.ts b/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallicBlack.d.ts
similarity index 100%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalicBlack.d.ts
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallicBlack.d.ts
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalicBlack.js b/packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallicBlack.js
similarity index 100%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetalicBlack.js
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/MastercardMetallicBlack.js
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetalic.d.ts b/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetalic.d.ts
deleted file mode 100644
index 726cf3c3d80..00000000000
--- a/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetalic.d.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import * as React from 'react';
-export interface VisaMetalicSVGProps extends React.HTMLProps<HTMLElement> {
-  width?: string;
-  height?: string;
-  viewBox?: string;
-}
-declare const VisaMetalicSVG: React.FC<VisaMetalicSVGProps>;
-export default VisaMetalicSVG;
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetallic.d.ts b/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetallic.d.ts
new file mode 100644
index 00000000000..f02ebe33d2a
--- /dev/null
+++ b/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetallic.d.ts
@@ -0,0 +1,9 @@
+import * as React from 'react';
+export interface VisaMetallicSVGProps
+  extends React.HTMLProps<HTMLElement> {
+  width?: string;
+  height?: string;
+  viewBox?: string;
+}
+declare const VisaMetallicSVG: React.FC<VisaMetallicSVGProps>;
+export default VisaMetallicSVG;
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetalic.js b/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetallic.js
similarity index 95%
rename from packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetalic.js
rename to packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetallic.js
index 510081dcdb1..1970960bf40 100644
--- a/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetalic.js
+++ b/packages/dnb-eufemia/src/extensions/payment-card/icons/VisaMetallic.js
@@ -1,9 +1,9 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-const VisaMetalicSVG = (props) => (
+const VisaMetallicSVG = (props) => (
   <svg {...props} fill="none" xmlns="http://www.w3.org/2000/svg">
-    <title>Visa Metalic</title>
+    <title>Visa Metallic</title>
     <path
       d="M53.5 43.2H51.6V50.9H53.5C55.9 50.9 57.2999 49.5 57.2999 47.1C57.2999 44.7 55.9 43.2 53.5 43.2ZM53.3999 50H52.5V43.9H53.3999C55.1999 43.9 56.2999 45 56.2999 46.9C56.2999 48.8 55.2999 50 53.3999 50ZM63.6 48.2C63.6 46.4 62.6 45.3 61 45.3C59.4 45.3 58.3999 46.5 58.3999 48.1C58.3999 49.8 59.5 50.9 61.2 50.9C62.2 50.9 63 50.5 63.5 49.7L62.7999 49.2C62.4999 49.7 62 50.1 61.2 50.1C60.3 50.1 59.3999 49.5 59.3999 48.3H63.6V48.2ZM61 46C61.9 46 62.5 46.6 62.6 47.6H59.2999C59.4999 46.6 60.1 46 61 46ZM67.6 45.3C66.8 45.3 66.1 45.7 65.7 46.3V43.2H64.7V50.9H65.5V49.8C65.9 50.6 66.6 51 67.5 51C69 51 70.1 49.8 70.1 48.2C70.1 46.4 69 45.3 67.6 45.3ZM67.3999 50.1C66.3999 50.1 65.6 49.2 65.6 48.1C65.6 46.9 66.3999 46.1 67.3999 46.1C68.3999 46.1 69.1 47 69.1 48.1C69.2 49.3 68.4999 50.1 67.3999 50.1ZM71.8999 44.5C72.2999 44.5 72.5 44.2 72.5 43.9C72.5 43.5 72.1999 43.3 71.8999 43.3C71.5999 43.3 71.2999 43.6 71.2999 43.9C71.1999 44.2 71.4999 44.5 71.8999 44.5ZM71.3999 50.9H72.3999V45.4H71.3999V50.9ZM76.2 50.1C75.6 50.1 75.3999 49.8 75.3999 49.3V46.1H76.7999V45.3H75.3999V43.6H74.3999V45.3H73.5V46.1H74.3999V49.3C74.3999 50.3 75 50.9 76 50.9C76.3 50.9 76.5999 50.9 76.7999 50.8V50C76.6999 50.1 76.4 50.1 76.2 50.1Z"
       fill="#B2B4B3"
@@ -84,15 +84,15 @@ const VisaMetalicSVG = (props) => (
     </defs>
   </svg>
 )
-VisaMetalicSVG.propTypes = {
+VisaMetallicSVG.propTypes = {
   width: PropTypes.string,
   height: PropTypes.string,
-  viewBox: PropTypes.string
+  viewBox: PropTypes.string,
 }
-VisaMetalicSVG.defaultProps = {
+VisaMetallicSVG.defaultProps = {
   width: '80',
   height: '54',
-  viewBox: '0 0 80 54'
+  viewBox: '0 0 80 54',
 }
 
-export default VisaMetalicSVG
+export default VisaMetallicSVG
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/icons/index.js b/packages/dnb-eufemia/src/extensions/payment-card/icons/index.js
index f18ef471d06..3c7783f5390 100644
--- a/packages/dnb-eufemia/src/extensions/payment-card/icons/index.js
+++ b/packages/dnb-eufemia/src/extensions/payment-card/icons/index.js
@@ -2,12 +2,12 @@ import React from 'react'
 
 import BankAxept from './BankAxept'
 import DNB from './DNB'
-import DNBMetalic from './DNBMetalic'
+import DNBMetallic from './DNBMetallic'
 import Expired from './Clock'
 import Blocked from './Padlock'
 import MastercardDefault from './MastercardDefault'
-import MastercardMetalic from './MastercardMetalic'
-import MastercardMetalicBlack from './MastercardMetalicBlack'
+import MastercardMetallic from './MastercardMetallic'
+import MastercardMetallicBlack from './MastercardMetallicBlack'
 import Pluss from './Pluss'
 import PB from './PB'
 import PBPlatinum from './PBPlatinum'
@@ -15,7 +15,7 @@ import SagaGold from './SagaGold'
 import SagaPlatinum from './SagaPlatinum'
 import SagaVisaPlatinum from './SagaVisaPlatinum'
 import VisaDefault from './VisaDefault'
-import VisaMetalic from './VisaMetalic'
+import VisaMetallic from './VisaMetallic'
 
 const BankLogo = ({ logoType, height }) =>
   logoType.cata({
@@ -26,12 +26,12 @@ const BankLogo = ({ logoType, height }) =>
         className="dnb-payment-card__card__bank-logo"
       />
     ),
-    Metalic: () => (
-      <DNBMetalic
+    Metallic: () => (
+      <DNBMetallic
         height={height}
         className="dnb-payment-card__card__bank-logo"
       />
-    )
+    ),
   })
 
 const ProductLogo = ({ productType, cardDesign }) => {
@@ -40,23 +40,23 @@ const ProductLogo = ({ productType, cardDesign }) => {
     BankAxept: () =>
       cardDesign.bankAxept.cata({
         White: () => <BankAxept className={id} fill="#ffffff" />,
-        Black: () => <BankAxept className={id} fill="#757575" />
+        Black: () => <BankAxept className={id} fill="#757575" />,
       }),
     Saga: () =>
       cardDesign.saga.cata({
         Gold: () => <SagaGold className={id} />,
         Platinum: () => <SagaPlatinum className={id} />,
         VisaPlatinum: () => <SagaVisaPlatinum className={id} />,
-        None: () => null
+        None: () => null,
       }),
     Pluss: () => <Pluss className={id} fill="#A5E1D2" />,
     PrivateBanking: () =>
       cardDesign.privateBanking.cata({
         Default: () => <PB className={id} />,
         Platinum: () => <PBPlatinum className={id} />,
-        None: () => null
+        None: () => null,
       }),
-    None: () => null
+    None: () => null,
   })
 }
 
@@ -80,7 +80,7 @@ const TypeLogo = ({ cardType, cardDesign }) => {
     Visa: () =>
       cardDesign.visa.cata({
         Colored: (color) => <VisaDefault className={id} fill={color} />,
-        Metalic: () => <VisaMetalic className={id} />
+        Metallic: () => <VisaMetallic className={id} />,
       }),
     Mastercard: () =>
       cardDesign.mastercard.cata({
@@ -88,10 +88,10 @@ const TypeLogo = ({ cardType, cardDesign }) => {
         DefaultWhite: () => (
           <MastercardDefault className={id} textFill="#ffffff" />
         ),
-        Metalic: () => <MastercardMetalic className={id} />,
-        BlackMetalic: () => <MastercardMetalicBlack className={id} />
+        Metallic: () => <MastercardMetallic className={id} />,
+        BlackMetallic: () => <MastercardMetallicBlack className={id} />,
       }),
-    None: () => null
+    None: () => null,
   })
 }
 
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/utils/CardDesigns.js b/packages/dnb-eufemia/src/extensions/payment-card/utils/CardDesigns.js
index dd1bee4d79c..a75c9d548ea 100644
--- a/packages/dnb-eufemia/src/extensions/payment-card/utils/CardDesigns.js
+++ b/packages/dnb-eufemia/src/extensions/payment-card/utils/CardDesigns.js
@@ -103,9 +103,9 @@ const sagaPlatinum = {
 const privateBanking = {
   name: 'Private Banking',
   cardStyle: 'card--design-private',
-  bankLogo: DNB.Metalic,
-  visa: Visa.Metalic,
-  mastercard: Mastercard.Metalic,
+  bankLogo: DNB.Metallic,
+  visa: Visa.Metallic,
+  mastercard: Mastercard.Metallic,
   bankAxept: BankAxept.White,
   saga: Saga.None,
   privateBanking: PB.Default,
@@ -115,8 +115,8 @@ const mcBlack = {
   name: 'Mastercard Black',
   cardStyle: 'card--design-black',
   bankLogo: DNB.Colored(properties['--color-black-80']),
-  visa: Visa.Metalic,
-  mastercard: Mastercard.BlackMetalic,
+  visa: Visa.Metallic,
+  mastercard: Mastercard.BlackMetallic,
   bankAxept: BankAxept.White,
   saga: Saga.None,
   privateBanking: PB.None,
diff --git a/packages/dnb-eufemia/src/extensions/payment-card/utils/Types.js b/packages/dnb-eufemia/src/extensions/payment-card/utils/Types.js
index 82a147c53f4..a7770d09874 100644
--- a/packages/dnb-eufemia/src/extensions/payment-card/utils/Types.js
+++ b/packages/dnb-eufemia/src/extensions/payment-card/utils/Types.js
@@ -4,19 +4,19 @@ const daggy = createDaggy()
 
 const DNB = daggy.taggedSum('DNB', {
   Colored: ['color'],
-  Metalic: [],
+  Metallic: [],
 })
 
 const Visa = daggy.taggedSum('Visa', {
   Colored: ['color'],
-  Metalic: [],
+  Metallic: [],
 })
 
 const Mastercard = daggy.taggedSum('Mastercard', {
   Default: [],
   DefaultWhite: [],
-  Metalic: [],
-  BlackMetalic: [],
+  Metallic: [],
+  BlackMetallic: [],
 })
 
 const CardType = daggy.taggedSum('CardType', {