diff --git a/.storybook/routes.js b/.storybook/routes.js
index a921a0cb03..5f17176fb5 100644
--- a/.storybook/routes.js
+++ b/.storybook/routes.js
@@ -84,6 +84,9 @@ const routes = {
   '/help/upgrade-guides/canvas-v15-upgrade-guide/': 'guides-upgrade-guides-v15-0-overview--docs',
   '/help/upgrade-guides/canvas-v15-upgrade-guide/#tab=visual-changes':
     'guides-upgrade-guides-v15-0-visual-changes--docs',
+  '/help/upgrade-guides/canvas-v16-upgrade-guide/': 'guides-upgrade-guides-v16-0-overview--docs',
+  '/help/upgrade-guides/canvas-v16-upgrade-guide/#tab=visual-changes':
+    'guides-upgrade-guides-v16-0-visual-changes--docs',
 };
 
 export default routes;
diff --git a/modules/docs/mdx/16.0-UPGRADE-GUIDE.mdx b/modules/docs/mdx/16.0-UPGRADE-GUIDE.mdx
index e571a21066..4dfb75917b 100644
--- a/modules/docs/mdx/16.0-UPGRADE-GUIDE.mdx
+++ b/modules/docs/mdx/16.0-UPGRADE-GUIDE.mdx
@@ -92,7 +92,58 @@ yarn remove @workday/canvas-kit-codemod
 
 ## Component Updates
 
-[Content will be added]
+> **Note:** All visual updates apply to both the Default Canvas theme and new Sana Canvas theme
+> unless specified otherwise.
+
+### Color Input
+
+**PR:** [#3992](https://github.com/Workday/canvas-kit/pull/3992)
+
+#### Visual Updates
+
+- Shape is now **12px** (previously 8px).
+
+### Color Picker
+
+**PR:** [#3992](https://github.com/Workday/canvas-kit/pull/3992)
+
+#### Visual Updates
+
+- **Sana Canvas:** swatch shape is now **6px** (previously **4px**).
+
+### Form Field
+
+**PR:** [#3992](https://github.com/Workday/canvas-kit/pull/3992)
+
+#### Visual Updates
+
+- Shape for grouped inputs (Radio groups and Checkbox groups) is now **12px** (previously 8px). As
+  in v15, this shape is primarily visible for error and caution states.
+- Block padding for grouped inputs is now **8px** (previously **10px** and **8px**). Inline padding
+  for grouped inputs is now **4px** (previously **12px**). Again, this padding is primarily visible
+  for error and caution states.
+- Error and caution states no longer display a status background color; only the standard background
+  is shown.
+
+### Text Area
+
+**PR:** [#3992](https://github.com/Workday/canvas-kit/pull/3992)
+
+#### Visual Updates
+
+- Shape is now **12px** (previously 8px).
+- Error and caution states no longer display a status background color; only the standard background
+  is shown.
+
+### Text Input
+
+**PR:** [#3992](https://github.com/Workday/canvas-kit/pull/3992)
+
+#### Visual Updates
+
+- Shape is now **12px** (previously 8px).
+- Error and caution states no longer display a status background color; only the standard background
+  is shown.
 
 ## New Utilities
 
diff --git a/modules/preview-react/color-picker/stories/visual-testing/ColorPicker.stories.tsx b/modules/preview-react/color-picker/stories/visual-testing/ColorPicker.stories.tsx
index 08138ac104..c09ced1a17 100644
--- a/modules/preview-react/color-picker/stories/visual-testing/ColorPicker.stories.tsx
+++ b/modules/preview-react/color-picker/stories/visual-testing/ColorPicker.stories.tsx
@@ -24,7 +24,7 @@ export const ColorPickerStates = {
     },
   },
   render: () => (
-    <StaticStates>
+    <StaticStates data-theme="sana-canvas">
       <ComponentStatesTable
         rowProps={[
           {label: 'Default', props: {}},
diff --git a/modules/react/color-picker/lib/parts/ColorSwatch.tsx b/modules/react/color-picker/lib/parts/ColorSwatch.tsx
index c924b998d2..a885facd17 100644
--- a/modules/react/color-picker/lib/parts/ColorSwatch.tsx
+++ b/modules/react/color-picker/lib/parts/ColorSwatch.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import {pickForegroundColor} from '@workday/canvas-kit-react/common';
+import {cornerShapeStencil, pickForegroundColor} from '@workday/canvas-kit-react/common';
 import {SystemIcon, systemIconStencil} from '@workday/canvas-kit-react/icon';
 import {calc, createStencil, handleCsProp, px2rem} from '@workday/canvas-kit-styling';
 import {checkSmallIcon} from '@workday/canvas-system-icons-web';
@@ -12,15 +12,16 @@ export interface ColorSwatchProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 
 export const colorPickerColorSwatchStencil = createStencil({
+  extends: cornerShapeStencil,
   vars: {
     color: '',
     iconColor: '',
   },
   base: ({color, iconColor}) => ({
     [systemIconStencil.vars.color]: iconColor,
+    [cornerShapeStencil.vars.shape]: system.legacy.shape.sm,
     width: system.legacy.size.xxs,
     height: system.legacy.size.xxs,
-    borderRadius: system.legacy.shape.sm,
     backgroundColor: color,
     display: 'flex',
     alignItems: 'center',
@@ -50,7 +51,7 @@ export const ColorSwatch = ({color, showCheck = false, ...elemProps}: ColorSwatc
         colorPickerColorSwatchStencil({
           color,
           iconColor: pickForegroundColor(color),
-          withShadow: showCheck || lowerCasedColor === '#ffffff',
+          withShadow: showCheck || lowerCasedColor === '#ffffff' ? 'true' : undefined,
         })
       )}
     >
diff --git a/modules/react/color-picker/stories/visualTesting.stories.tsx b/modules/react/color-picker/stories/visualTesting.stories.tsx
index c404d5d1d2..9b1ee7fdef 100644
--- a/modules/react/color-picker/stories/visualTesting.stories.tsx
+++ b/modules/react/color-picker/stories/visualTesting.stories.tsx
@@ -21,7 +21,7 @@ export default {
 };
 
 export const ColorInputStates = () => (
-  <StaticStates>
+  <StaticStates data-theme="sana-canvas">
     <ComponentStatesTable
       rowProps={permutateProps(
         {
diff --git a/modules/react/form-field/lib/FormFieldGroupList.tsx b/modules/react/form-field/lib/FormFieldGroupList.tsx
index a8e8a64fc7..ecbc4da6ae 100644
--- a/modules/react/form-field/lib/FormFieldGroupList.tsx
+++ b/modules/react/form-field/lib/FormFieldGroupList.tsx
@@ -1,4 +1,4 @@
-import {createSubcomponent} from '@workday/canvas-kit-react/common';
+import {cornerShapeStencil, createSubcomponent} from '@workday/canvas-kit-react/common';
 import {FlexProps} from '@workday/canvas-kit-react/layout';
 import {CSProps, calc, createStencil, handleCsProp, px2rem} from '@workday/canvas-kit-styling';
 import {base, system} from '@workday/canvas-tokens-web';
@@ -8,12 +8,13 @@ import {useFormFieldModel} from './hooks';
 export interface FormFieldGroupListProps extends CSProps, FlexProps {}
 
 const formFieldGroupListStencil = createStencil({
+  extends: cornerShapeStencil,
   base: {
+    [cornerShapeStencil.vars.shape]: system.legacy.shape.lg,
     display: 'flex',
     flexDirection: 'column',
-    borderRadius: system.legacy.shape.md,
     gap: system.legacy.gap.sm,
-    padding: `${px2rem(10)} ${base.legacy.size150} ${system.legacy.padding.xs}`,
+    padding: `${system.legacy.padding.xs} ${system.legacy.padding.xxs}`,
     margin: `0 ${calc.negate(base.legacy.size150)}`,
     transition: '100ms box-shadow',
     width: 'fit-content',
@@ -21,11 +22,9 @@ const formFieldGroupListStencil = createStencil({
   modifiers: {
     error: {
       error: {
-        backgroundColor: system.legacy.color.brand.surface.critical.default,
         boxShadow: `inset 0 0 0 ${px2rem(2)} ${system.legacy.color.brand.border.critical}`,
       },
       caution: {
-        backgroundColor: system.legacy.color.brand.surface.caution.default,
         boxShadow: `inset 0 0 0 ${px2rem(1)} ${system.legacy.color.brand.border.caution}, inset 0 0 0 ${px2rem(3)} ${system.legacy.color.brand.focus.caution.inner}`,
       },
     },
diff --git a/modules/react/form-field/stories/visualTesting.stories.tsx b/modules/react/form-field/stories/visualTesting.stories.tsx
index 17d812751d..65ba91d01f 100644
--- a/modules/react/form-field/stories/visualTesting.stories.tsx
+++ b/modules/react/form-field/stories/visualTesting.stories.tsx
@@ -21,7 +21,7 @@ export default {
 };
 
 export const FormFieldStates = () => (
-  <StaticStates>
+  <StaticStates data-theme="sana-canvas">
     <ComponentStatesTable
       rowProps={[
         {label: 'Required', props: {isRequired: true}},
diff --git a/modules/react/text-area/stories/visualTesting.stories.tsx b/modules/react/text-area/stories/visualTesting.stories.tsx
index f3a3144030..5cbdb5f506 100644
--- a/modules/react/text-area/stories/visualTesting.stories.tsx
+++ b/modules/react/text-area/stories/visualTesting.stories.tsx
@@ -20,7 +20,7 @@ export default {
 };
 
 export const TextAreaStates = () => (
-  <StaticStates>
+  <StaticStates data-theme="sana-canvas">
     <ComponentStatesTable
       rowProps={permutateProps(
         {
diff --git a/modules/react/text-input/lib/TextInput.tsx b/modules/react/text-input/lib/TextInput.tsx
index 5cb1be52ef..db6e2c7eff 100644
--- a/modules/react/text-input/lib/TextInput.tsx
+++ b/modules/react/text-input/lib/TextInput.tsx
@@ -1,4 +1,9 @@
-import {ErrorType, GrowthBehavior, createComponent} from '@workday/canvas-kit-react/common';
+import {
+  ErrorType,
+  GrowthBehavior,
+  cornerShapeStencil,
+  createComponent,
+} from '@workday/canvas-kit-react/common';
 import {mergeStyles} from '@workday/canvas-kit-react/layout';
 import {CSProps, createStencil, cssVar, px2rem} from '@workday/canvas-kit-styling';
 import {system} from '@workday/canvas-tokens-web';
@@ -15,10 +20,12 @@ export interface TextInputProps extends GrowthBehavior, CSProps {
 }
 
 export const textInputStencil = createStencil({
+  extends: cornerShapeStencil,
   vars: {
     width: '',
   },
   base: ({width}) => ({
+    [cornerShapeStencil.vars.shape]: system.legacy.shape.lg,
     fontFamily: system.fontFamily.default,
     fontSize: system.legacy.fontSize.subtext.lg,
     fontWeight: system.fontWeight.normal,
@@ -27,7 +34,6 @@ export const textInputStencil = createStencil({
     display: 'block',
     border: `${px2rem(1)} solid ${system.color.border.input.default}`,
     backgroundColor: system.legacy.color.surface.default,
-    borderRadius: system.legacy.shape.md,
     height: system.legacy.size.md,
     transition: '0.2s box-shadow, 0.2s border-color',
     padding: system.legacy.padding.xs, // Compensate for border
@@ -74,7 +80,6 @@ export const textInputStencil = createStencil({
         borderColor: system.legacy.color.brand.border.critical,
         // borderWidth: px2rem(2),
         boxShadow: `inset 0 0 0 ${px2rem(2)} ${system.legacy.color.brand.border.critical}`,
-        backgroundColor: system.legacy.color.brand.surface.critical.default,
         '&:is(:hover, .hover, :disabled, .disabled, :focus-visible:not([disabled]), .focus:not([disabled]))':
           {
             borderColor: system.legacy.color.brand.border.critical,
@@ -89,7 +94,6 @@ export const textInputStencil = createStencil({
       caution: {
         borderColor: system.legacy.color.brand.border.caution,
         boxShadow: `inset 0 0 0 ${px2rem(2)} ${system.legacy.color.brand.focus.caution.inner}`,
-        backgroundColor: system.legacy.color.brand.surface.caution.default,
         '&:is(:hover, .hover, :disabled, .disabled, :focus-visible:not([disabled]), .focus:not([disabled]))':
           {
             borderColor: system.legacy.color.brand.border.caution,
@@ -117,7 +121,11 @@ export const TextInput = createComponent('input')({
         ref={ref}
         {...mergeStyles(
           elemProps,
-          textInputStencil({width: typeof width === 'number' ? px2rem(width) : width, grow, error})
+          textInputStencil({
+            width: typeof width === 'number' ? px2rem(width) : width,
+            grow: grow === true ? 'true' : grow === false ? 'false' : undefined,
+            error,
+          })
         )}
       />
     );
diff --git a/modules/react/text-input/stories/visualTesting.stories.tsx b/modules/react/text-input/stories/visualTesting.stories.tsx
index c39826c549..82822dd5a6 100644
--- a/modules/react/text-input/stories/visualTesting.stories.tsx
+++ b/modules/react/text-input/stories/visualTesting.stories.tsx
@@ -24,7 +24,7 @@ export default {
 };
 
 export const TextInputStates = () => (
-  <StaticStates>
+  <StaticStates data-theme="sana-canvas">
     <ComponentStatesTable
       rowProps={permutateProps(
         {
@@ -88,7 +88,7 @@ TextInputThemedStates.parameters = {
 };
 
 export const InputGroupStates = () => (
-  <StaticStates>
+  <StaticStates data-theme="sana-canvas">
     <ComponentStatesTable
       rowProps={[
         {