diff --git a/web-wallet/README.md b/web-wallet/README.md
index ec583725a2..76abd3aae1 100644
--- a/web-wallet/README.md
+++ b/web-wallet/README.md
@@ -33,6 +33,7 @@ N.B. the current `0.1.2` version of the library has no option to pick the networ
 ```
 # can be empty string, must start with a slash otherwise, must not end with a slash
 VITE_BASE_PATH=""
+VITE_CONTRACT_ALLOCATE_DISABLED=false
 VITE_CONTRACT_STAKE_DISABLED=false
 VITE_CONTRACT_TRANSFER_DISABLED=false
 VITE_CURRENT_NODE=${VITE_LOCAL_NODE}
diff --git a/web-wallet/src/lib/components/Allocate/Allocate.svelte b/web-wallet/src/lib/components/Allocate/Allocate.svelte
new file mode 100644
index 0000000000..9e43608959
--- /dev/null
+++ b/web-wallet/src/lib/components/Allocate/Allocate.svelte
@@ -0,0 +1,421 @@
+<svelte:options immutable={true} />
+
+<script>
+  import { fade } from "svelte/transition";
+  import { createEventDispatcher, onMount } from "svelte";
+  import {
+    mdiArrowUpBoldBoxOutline,
+    mdiShieldLock,
+    mdiShieldLockOpenOutline,
+    mdiWalletOutline,
+  } from "@mdi/js";
+  import { areValidGasSettings, deductLuxFeeFrom } from "$lib/contracts";
+  import { duskToLux, luxToDusk } from "$lib/dusk/currency";
+  import {
+    calculateAdaptiveCharCount,
+    middleEllipsis,
+    validateAddress,
+  } from "$lib/dusk/string";
+  import { logo } from "$lib/dusk/icons";
+  import {
+    Badge,
+    Button,
+    Icon,
+    Textbox,
+    Wizard,
+    WizardStep,
+  } from "$lib/dusk/components";
+  import {
+    AppAnchorButton,
+    GasFee,
+    GasSettings,
+    OperationResult,
+    ScanQR,
+  } from "$lib/components";
+
+  /** @type {(to: string, amount: number, gasPrice: number, gasLimit: number) => Promise<string>} */
+  export let execute;
+
+  /** @type {(amount: number) => string} */
+  export let formatter;
+
+  /** @type {ContractGasSettings} */
+  export let gasSettings;
+
+  /** @type {GasStoreContent} */
+  export let gasLimits;
+
+  /** @type {string} */
+  export let shieldedAddress;
+
+  /** @type {string} */
+  export let unshieldedAddress;
+
+  /** @type {number} */
+  export let shieldedBalance;
+
+  /** @type {number} */
+  export let unshieldedBalance;
+
+  /** @type {HTMLInputElement | null} */
+  let amountInput;
+
+  /** @type {boolean} */
+  let isNextButtonDisabled = false;
+
+  /** @type {boolean} */
+  let isGasValid = false;
+
+  let { gasLimit, gasPrice } = gasSettings;
+
+  /** @type {number} */
+  let shieldedAmount = shieldedBalance;
+
+  /** @type {number} */
+  let unshieldedAmount = unshieldedBalance;
+
+  /** @type {number} */
+  let screenWidth = window.innerWidth;
+
+  const minAmount = 0.000000001;
+  const dispatch = createEventDispatcher();
+  const resetOperation = () => dispatch("operationChange", "");
+
+  onMount(() => {
+    amountInput = document.querySelector(".operation__input-field");
+    isGasValid = areValidGasSettings(gasPrice, gasLimit);
+
+    const resizeObserver = new ResizeObserver((entries) => {
+      const entry = entries[0];
+
+      screenWidth = entry.contentRect.width;
+    });
+
+    resizeObserver.observe(document.body);
+
+    return () => resizeObserver.disconnect();
+  });
+
+  $: luxFee = gasLimit * gasPrice;
+  $: fee = formatter(luxToDusk(luxFee));
+  $: isFromUnshielded = shieldedAmount > shieldedBalance;
+  $: isFromShielded = unshieldedAmount > unshieldedBalance;
+  $: isNextButtonDisabled = !(isFromUnshielded || isFromShielded);
+
+</script>
+
+<div class="operation">
+  <Wizard steps={3} let:key>
+    <WizardStep
+      step={0}
+      {key}
+      backButton={{
+        href: "/dashboard",
+        disabled: false,
+        isAnchor: true,
+      }}
+      nextButton={{ disabled: isNextButtonDisabled }}
+    >
+      <div in:fade|global class="operation__send">
+        <p>
+          Edit the value to change the allocation of your Dusk between your
+          shielded or public account.
+        </p>
+
+        <fieldset class="operation__fieldset">
+          <div class="operation__send-amount operation__label">
+            Shielded
+          </div>
+
+          <div class="operation__send-amount operation__address operation__space-between">
+            <Icon path={mdiShieldLock} />
+            {middleEllipsis(
+              shieldedAddress,
+              calculateAdaptiveCharCount(screenWidth, 320, 640, 5, 20)
+            )}
+          </div>
+
+          <div class="operation__send-amount operation__input">
+            <Textbox
+              className="operation__input-field"
+              bind:value={shieldedAmount}
+              required
+              type="number"
+              min={minAmount}
+              max={deductLuxFeeFrom(shieldedBalance + unshieldedBalance, luxFee)}
+              step="0.000000001"
+              on:input={() => {
+                unshieldedAmount = +((shieldedBalance + unshieldedBalance) - shieldedAmount).toFixed(9);
+              }}
+            />
+            <Icon
+              data-tooltip-id="main-tooltip"
+              data-tooltip-text="DUSK"
+              path={logo}
+            />
+          </div>
+
+          <hr class="glyph" />
+
+          <div class="operation__send-amount operation__label">
+            Unshielded
+          </div>
+
+          <div class="operation__send-amount operation__address operation__space-between">
+            <Icon path={mdiShieldLockOpenOutline} />
+            {middleEllipsis(
+              unshieldedAddress,
+              calculateAdaptiveCharCount(screenWidth, 320, 640, 5, 20)
+            )}
+          </div>
+
+          <div class="operation__send-amount operation__input">
+            <Textbox
+              className="operation__input-field"
+              bind:value={unshieldedAmount}
+              required
+              type="number"
+              min={minAmount}
+              max={deductLuxFeeFrom(unshieldedBalance + shieldedBalance, luxFee)}
+              step="0.000000001"
+              id="unshielded-amount"
+              on:input={() => {
+                shieldedAmount = +((unshieldedBalance + shieldedBalance) - unshieldedAmount).toFixed(9);
+              }}
+            />
+            <Icon
+              data-tooltip-id="main-tooltip"
+              data-tooltip-text="DUSK"
+              path={logo}
+            />
+          </div>
+        </fieldset>
+
+        <GasSettings
+          {fee}
+          limit={gasSettings.gasLimit}
+          limitLower={gasLimits.gasLimitLower}
+          limitUpper={gasLimits.gasLimitUpper}
+          price={gasSettings.gasPrice}
+          priceLower={gasLimits.gasPriceLower}
+          on:gasSettings={(event) => {
+            isGasValid = areValidGasSettings(
+              event.detail.price,
+              event.detail.limit
+            );
+
+            if (isGasValid) {
+              gasPrice = event.detail.price;
+              gasLimit = event.detail.limit;
+            }
+          }}
+        />
+      </div>
+    </WizardStep>
+    <WizardStep
+      step={1}
+      {key}
+      nextButton={{
+        icon: { path: mdiArrowUpBoldBoxOutline, position: "before" },
+        label: "SEND",
+        variant: "primary",
+      }}
+    >
+      <div in:fade|global class="operation__send">
+        <Badge
+          className="operation__review-notice"
+          text="REVIEW TRANSACTION"
+          variant="warning"
+        />
+
+        <dl class="operation__review-transaction">
+          <dt class="review-transaction__label">
+            <Icon path={mdiArrowUpBoldBoxOutline} />
+            <span>Amount:</span>
+          </dt>
+          <dd class="review-transaction__value operation__review-amount">
+            <span>
+              {
+                isFromUnshielded 
+                ? `${formatter(luxToDusk(duskToLux(unshieldedBalance) - duskToLux(unshieldedAmount)))} DUSK`
+                : `${formatter(luxToDusk(duskToLux(shieldedBalance) - duskToLux(shieldedAmount)))} DUSK`
+              }
+            </span>
+            <Icon
+              className="dusk-amount__icon"
+              path={logo}
+              data-tooltip-id="main-tooltip"
+              data-tooltip-text="DUSK"
+            />
+          </dd>
+        </dl>
+
+        <dl class="operation__review-transaction">
+          <dt class="review-transaction__label">
+            <Icon path={isFromUnshielded ? mdiShieldLockOpenOutline : mdiShieldLock} />
+            <span>From</span>
+          </dt>
+          <dd class="operation__review-address">
+            <span>
+              {
+                isFromUnshielded 
+                ? unshieldedAddress
+                : shieldedAddress
+              }
+            </span>
+          </dd>
+        </dl>
+
+        <dl class="operation__review-transaction">
+          <dt class="review-transaction__label">
+            <Icon path={isFromShielded ? mdiShieldLockOpenOutline : mdiShieldLock} />
+            <span>To</span>
+          </dt>
+          <dd class="operation__review-address">
+            <span>
+              {
+                isFromShielded 
+                ? unshieldedAddress
+                : shieldedAddress
+              }
+            </span>
+          </dd>
+        </dl>
+
+        <GasFee {fee} />
+      </div>
+    </WizardStep>
+    <WizardStep step={2} {key} showNavigation={false}>
+      <OperationResult
+        errorMessage="Transaction failed"
+        onBeforeLeave={resetOperation}
+        operation={execute(
+          isFromShielded ? unshieldedAddress : shieldedAddress, 
+          isFromShielded ? unshieldedAmount : shieldedAmount, 
+          gasPrice, 
+          gasLimit
+        )}
+        pendingMessage="Processing transaction"
+        successMessage="Transaction completed"
+      >
+        <svelte:fragment slot="success-content" let:result={hash}>
+          {#if hash}
+            <AppAnchorButton
+              href={`https://explorer.dusk.network/transactions/transaction?id=${hash}`}
+              on:click={resetOperation}
+              text="VIEW ON BLOCK EXPLORER"
+              rel="noopener noreferrer"
+              target="_blank"
+            />
+          {/if}
+        </svelte:fragment>
+      </OperationResult>
+    </WizardStep>
+  </Wizard>
+</div>
+
+<style lang="postcss">
+  .operation {
+    &__fieldset {
+      display: flex;
+      padding: 1rem 1.25rem;
+      flex-direction: column;
+      justify-content: center;
+      align-items: flex-start;
+      gap: 1.25rem;
+      align-self: stretch;
+
+      border-radius: var(--fieldset-border-radius);
+      background: var(--fieldset-background-color);
+    }
+
+    &__address{
+      font-family: var(--mono-font-family);
+    }
+
+    &__review-address {
+      background-color: transparent;
+      border: 1px solid var(--primary-color);
+      border-radius: 1.5em;
+      padding: 0.75em 1em;
+      width: 100%;
+      line-break: anywhere;
+    }
+
+    &__review-transaction {
+      display: flex;
+      flex-direction: column;
+      gap: 0.625em;
+    }
+
+    &__review-amount {
+      justify-content: flex-start;
+    }
+
+    &__send {
+      display: flex;
+      flex-direction: column;
+      gap: 1.2em;
+    }
+
+    &__label {
+      font-family: var(--mono-font-family);
+    }
+
+    &__send-amount {
+      display: flex;
+      align-items: center;
+      width: 100%;
+    }
+
+    &__space-between {
+      justify-content: space-between;
+    }
+
+    &__input {
+      column-gap: var(--default-gap);
+    }
+
+    :global(&__input &__input-field) {
+      width: 100%;
+      padding: 0.5em 1em;
+    }
+
+    :global(&__input-field:invalid) {
+      color: var(--error-color);
+    }
+
+    :global(&__send-address) {
+      width: 100%;
+    }
+
+    :global(&__review-notice) {
+      text-align: center;
+    }
+
+    :global(.dusk-amount__icon) {
+      width: 1em;
+      height: 1em;
+      flex-shrink: 0;
+    }
+  }
+
+  .review-transaction__label,
+  .review-transaction__value {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--small-gap);
+  }
+
+  .review-transaction__value {
+    font-weight: bold;
+  }
+
+  :global(.operation__send-address--invalid) {
+    color: var(--error-color);
+  }
+
+  hr.glyph:after {
+    content: "↑↓";
+  }
+</style>
diff --git a/web-wallet/src/lib/components/GasFee/GasFee.svelte b/web-wallet/src/lib/components/GasFee/GasFee.svelte
index 205cb44020..563f483aa3 100644
--- a/web-wallet/src/lib/components/GasFee/GasFee.svelte
+++ b/web-wallet/src/lib/components/GasFee/GasFee.svelte
@@ -7,9 +7,9 @@
 </script>
 
 <div class="gas-fee">
-  <span>Max Gas Fee:</span>
+  <span>Fee:</span>
   <div class="gas-fee__amount">
-    <span class="gas-fee__amount-value">{fee}</span>
+    <div class="gas-fee__amount-value"><span>max</span> <span>{fee}</span></div>
     <Icon
       className="dusk-amount__icon"
       path={logo}
@@ -35,6 +35,12 @@
 
     &__amount-value {
       font-weight: 600;
+      display: flex;
+      gap: 0.5em;
+
+      & > span:first-of-type {
+        font-weight: initial;
+      }
     }
   }
 
diff --git a/web-wallet/src/lib/components/index.js b/web-wallet/src/lib/components/index.js
index cb7aecd03a..a4914716ab 100644
--- a/web-wallet/src/lib/components/index.js
+++ b/web-wallet/src/lib/components/index.js
@@ -1,4 +1,5 @@
 export { default as AddressPicker } from "./AddressPicker/AddressPicker.svelte";
+export { default as Allocate } from "./Allocate/Allocate.svelte";
 export { default as AppAnchor } from "./AppAnchor/AppAnchor.svelte";
 export { default as AppAnchorButton } from "./AppAnchorButton/AppAnchorButton.svelte";
 export { default as AppImage } from "./AppImage/AppImage.svelte";
diff --git a/web-wallet/src/lib/containers/AllocateContract/AllocateContract.svelte b/web-wallet/src/lib/containers/AllocateContract/AllocateContract.svelte
new file mode 100644
index 0000000000..9c9a5ecb7c
--- /dev/null
+++ b/web-wallet/src/lib/containers/AllocateContract/AllocateContract.svelte
@@ -0,0 +1,78 @@
+<svelte:options immutable={true} />
+
+<script>
+  import {
+    allOf,
+    collect,
+    getKey,
+    hasKeyValue,
+    map,
+    pick,
+    setKey,
+    when,
+  } from "lamb";
+
+  import { createCurrencyFormatter } from "$lib/dusk/currency";
+  import { getLastTransactionHash } from "$lib/transactions";
+  import {
+    gasStore,
+    // operationsStore,
+    settingsStore,
+    walletStore,
+  } from "$lib/stores";
+  import { Allocate } from "$lib/components";
+
+  /** @type {ContractDescriptor} */
+  export let descriptor;
+
+  /** @type {(to: string, amount: number, gasPrice:number, gasLimit:number) => Promise<string>} */
+  const executeSend = (to, amount, gasPrice, gasLimit) =>
+    walletStore
+      .transfer(to, amount, gasPrice, gasLimit)
+      .then(getLastTransactionHash);
+  const collectSettings = collect([
+    pick(["gasLimit", "gasPrice"]),
+    getKey("language"),
+  ]);
+  const isEnabledSend = allOf([
+    hasKeyValue("disabled", false),
+    hasKeyValue("id", "send"),
+  ]);
+
+  const gasLimits = $gasStore;
+
+  // $: ({ currentOperation } = $operationsStore);
+  $: [gasSettings, language] = collectSettings($settingsStore);
+  $: ({ balance, currentAddress, error, isSyncing } = $walletStore);
+  $: duskFormatter = createCurrencyFormatter(language, "DUSK", 9);
+
+  /**
+   * We want to update the disabled status ourselves only
+   * when the send operation is enabled in the descriptor;
+   * otherwise the descriptor takes precedence.
+   */
+  $: operations = map(
+    descriptor.operations,
+    when(isEnabledSend, setKey("disabled", isSyncing || !!error))
+  );
+</script>
+
+<!-- {#if currentOperation === "send"} -->
+<Allocate
+  shieldedAddress={currentAddress}
+  unshieldedAddress={currentAddress}
+  shieldedBalance={1000}
+  unshieldedBalance={1000}
+  execute={executeSend}
+  formatter={duskFormatter}
+  {gasLimits}
+  {gasSettings}
+  on:operationChange
+  
+/>
+<!-- {:else if currentOperation === "receive"}
+  <Receive on:operationChange address={currentAddress} />
+{:else}
+  <ContractStatusesList items={statuses} />
+  <ContractOperations items={operations} on:operationChange />
+{/if} -->
diff --git a/web-wallet/src/lib/containers/index.js b/web-wallet/src/lib/containers/index.js
index 2387cdbe37..0c1394e722 100644
--- a/web-wallet/src/lib/containers/index.js
+++ b/web-wallet/src/lib/containers/index.js
@@ -1,3 +1,4 @@
+export { default as AllocateContract } from "./AllocateContract/AllocateContract.svelte";
+export { default as MigrateContract } from "./MigrateContract/MigrateContract.svelte";
 export { default as StakeContract } from "./StakeContract/StakeContract.svelte";
 export { default as TransferContract } from "./TransferContract/TransferContract.svelte";
-export { default as MigrateContract } from "./MigrateContract/MigrateContract.svelte";
diff --git a/web-wallet/src/lib/contracts/contract-descriptors.js b/web-wallet/src/lib/contracts/contract-descriptors.js
index 50afc04304..49d4f75f96 100644
--- a/web-wallet/src/lib/contracts/contract-descriptors.js
+++ b/web-wallet/src/lib/contracts/contract-descriptors.js
@@ -54,4 +54,19 @@ export default [
       },
     ],
   },
+  {
+    disabled:
+      import.meta.env.VITE_CONTRACT_ALLOCATE_DISABLED &&
+      import.meta.env.VITE_CONTRACT_ALLOCATE_DISABLED === "true",
+    id: "allocate",
+    label: "Shield / Unshield",
+    operations: [
+      {
+        disabled: false,
+        id: "send",
+        label: "send",
+        primary: true,
+      },
+    ],
+  },
 ];
diff --git a/web-wallet/src/lib/contracts/index.js b/web-wallet/src/lib/contracts/index.js
index e71743ccff..76bf5d238c 100644
--- a/web-wallet/src/lib/contracts/index.js
+++ b/web-wallet/src/lib/contracts/index.js
@@ -1,3 +1,4 @@
 export { default as contractDescriptors } from "./contract-descriptors";
 export { default as deductLuxFeeFrom } from "./deductLuxFeeFrom";
 export { default as areValidGasSettings } from "./areValidGasSettings";
+export { default as updateOperation } from "./updateOperation";
diff --git a/web-wallet/src/lib/contracts/updateOperation.js b/web-wallet/src/lib/contracts/updateOperation.js
new file mode 100644
index 0000000000..a3ebdfe992
--- /dev/null
+++ b/web-wallet/src/lib/contracts/updateOperation.js
@@ -0,0 +1,11 @@
+import { operationsStore } from "$lib/stores";
+
+/** @param {string} id */
+function updateOperation(id) {
+  operationsStore.update((store) => ({
+    ...store,
+    currentOperation: id,
+  }));
+}
+
+export default updateOperation;
diff --git a/web-wallet/src/routes/(app)/dashboard/+page.svelte b/web-wallet/src/routes/(app)/dashboard/+page.svelte
index 440bca589a..086ab49dba 100644
--- a/web-wallet/src/routes/(app)/dashboard/+page.svelte
+++ b/web-wallet/src/routes/(app)/dashboard/+page.svelte
@@ -2,7 +2,12 @@
 
 <script>
   import { filterWith, hasKeyValue } from "lamb";
-  import { mdiContain, mdiDatabaseOutline, mdiSwapVertical } from "@mdi/js";
+  import {
+    mdiContain,
+    mdiDatabaseOutline,
+    mdiSwapVertical,
+    mdiSync,
+  } from "@mdi/js";
   import { Icon } from "$lib/dusk/components";
   import { DashboardNav, Transactions } from "$lib/components";
   import { settingsStore, walletStore } from "$lib/stores";
@@ -10,12 +15,28 @@
 
   const { dashboardTransactionLimit, language } = $settingsStore;
 
+  function getIconsForContract(contract) {
+    switch (contract) {
+      case "allocate":
+        return [{ path: mdiSync }];
+        break;
+      case "staking":
+        return [{ path: mdiDatabaseOutline }];
+        break;
+      case "transfer":
+        return [{ path: mdiSwapVertical }];
+        break;
+      default:
+        break;
+    }
+  }
+
   /** @type {(descriptors: ContractDescriptor[]) => ContractDescriptor[]} */
   const getEnabledContracts = filterWith(hasKeyValue("disabled", false));
   const enabledContracts = getEnabledContracts(contractDescriptors);
   const dashboardNavItems = enabledContracts.map(({ id, label }) => ({
     href: id,
-    icons: [{ path: id === "transfer" ? mdiSwapVertical : mdiDatabaseOutline }],
+    icons: getIconsForContract(id),
     id,
     label,
   }));
@@ -67,7 +88,6 @@
     & p:not(:last-child) {
       margin-bottom: 1em;
     }
-
     h4 {
       margin-bottom: 0.5em;
     }
diff --git a/web-wallet/src/routes/(app)/dashboard/allocate/+page.svelte b/web-wallet/src/routes/(app)/dashboard/allocate/+page.svelte
new file mode 100644
index 0000000000..cbb64ee11b
--- /dev/null
+++ b/web-wallet/src/routes/(app)/dashboard/allocate/+page.svelte
@@ -0,0 +1,37 @@
+<svelte:options immutable={true} />
+
+<script>
+  import { onDestroy } from "svelte";
+  import { mdiSync } from "@mdi/js";
+  import { AllocateContract } from "$lib/containers";
+  import { IconHeadingCard } from "$lib/containers/Cards";
+  import { contractDescriptors } from "$lib/contracts";
+  import { operationsStore, settingsStore } from "$lib/stores";
+  /** @param {string} id */
+  function updateOperation(id) {
+    operationsStore.update((store) => ({
+      ...store,
+      currentOperation: id,
+    }));
+  }
+  /**
+   * @param {keyof SettingsStoreContent} property
+   * @param {any} value
+   */
+  function updateSetting(property, value) {
+    settingsStore.update((store) => ({
+      ...store,
+      [property]: value,
+    }));
+  }
+  onDestroy(() => {
+    updateOperation("");
+  });
+</script>
+
+<IconHeadingCard heading="Shield / Unshield" iconPath={mdiSync} reverse>
+  <AllocateContract
+    descriptor={contractDescriptors[2]}
+    on:operationChange={({ detail }) => updateOperation(detail)}
+  />
+</IconHeadingCard>
diff --git a/web-wallet/src/routes/(app)/dashboard/transfer/+page.svelte b/web-wallet/src/routes/(app)/dashboard/transfer/+page.svelte
index 72a175d315..3f776746d9 100644
--- a/web-wallet/src/routes/(app)/dashboard/transfer/+page.svelte
+++ b/web-wallet/src/routes/(app)/dashboard/transfer/+page.svelte
@@ -4,18 +4,9 @@
   import { onDestroy } from "svelte";
   import { TransferContract } from "$lib/containers";
   import { IconHeadingCard } from "$lib/containers/Cards";
-  import { contractDescriptors } from "$lib/contracts";
-  import { operationsStore } from "$lib/stores";
+  import { contractDescriptors, updateOperation } from "$lib/contracts";
   import { mdiSwapVertical } from "@mdi/js";
 
-  /** @param {string} id */
-  function updateOperation(id) {
-    operationsStore.update((store) => ({
-      ...store,
-      currentOperation: id,
-    }));
-  }
-
   onDestroy(() => {
     updateOperation("");
   });
diff --git a/web-wallet/src/style/app-components/horizontal-rules.css b/web-wallet/src/style/app-components/horizontal-rules.css
index 4d516c47f2..8c803e6383 100644
--- a/web-wallet/src/style/app-components/horizontal-rules.css
+++ b/web-wallet/src/style/app-components/horizontal-rules.css
@@ -1,5 +1,20 @@
 hr {
+  text-align: center;
+  overflow: visible;
   border: none;
   border-top: 1px solid var(--divider-color-primary);
   width: 100%;
+  height: 1px;
+  padding: 0;
+}
+
+hr.glyph:after {
+  display: inline-block;
+  position: relative;
+  top: -1.1em;
+  font-size: 1em;
+  border: solid thin var(--divider-border-color);
+  border-radius: 2em;
+  padding: 0.5em 1.25em;
+  background-color: var(--divider-background-color);
 }
diff --git a/web-wallet/src/style/dusk/language.css b/web-wallet/src/style/dusk/language.css
index b26b9e0452..74aff3f4d6 100644
--- a/web-wallet/src/style/dusk/language.css
+++ b/web-wallet/src/style/dusk/language.css
@@ -109,9 +109,15 @@
   --checkbox-control-border-color: var(--smokey-black);
   --checkbox-control-checked-bg-color: var(--smokey-black);
 
+  /* Fieldset */
+  --fieldset-background-color: var(--light-grey);
+  --fieldset-border-radius: 1.5em;
+
   /* Dividers */
 
-  --divider-color-primary: var(--taupe-grey);
+  --divider-color-primary: var(--smokey-black);
+  --divider-background-color: var(--light-gray);
+  --divider-border-color: var(--smokey-black);
 
   /* Home animation */
 
@@ -152,6 +158,16 @@
   --checkbox-control-border-color: var(--light-grey);
   --checkbox-control-checked-bg-color: var(--light-grey);
 
+  /* Fieldset */
+
+  --fieldset-background-color: var(--smokey-black);
+
+  /* Dividers */
+
+  --divider-color-primary: var(--magnolia);
+  --divider-background-color: var(--smokey-black);
+  --divider-border-color: var(--magnolia);
+
   /* Home animation */
 
   --home-grid-color: var(--smokey-black);
diff --git a/web-wallet/src/style/main.css b/web-wallet/src/style/main.css
index 3e99a04f9c..345fc9def8 100644
--- a/web-wallet/src/style/main.css
+++ b/web-wallet/src/style/main.css
@@ -92,6 +92,10 @@ svg {
   fill: currentColor;
 }
 
+fieldset {
+  border: none;
+}
+
 #outer-container {
   background-color: var(--background-color);
   width: 60%;