diff --git a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.jsx b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.jsx
index 467a96221d..a5662d794c 100644
--- a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.jsx
+++ b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.jsx
@@ -104,6 +104,7 @@ const propTypes = {
         value: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string]),
       })
     ),
+    tooltip: PropTypes.string,
   }),
   setEditDataItem: PropTypes.func,
   /** an object where the keys are available dimensions and the values are the values available for those dimensions
@@ -147,6 +148,14 @@ const propTypes = {
    * Used to override the default behaviour of handleDataItemEdit. if we dont pass any function then it uses handleDefaultDataItemEdit function by default
    */
   handleDataItemEdit: PropTypes.func,
+
+  options: PropTypes.shape({
+    hasColorDropdown: PropTypes.bool,
+    hasUnit: PropTypes.bool,
+    hasDecimalPlacesDropdown: PropTypes.bool,
+    hasThresholds: PropTypes.bool,
+    hasTooltip: PropTypes.bool,
+  }),
 };
 
 const defaultProps = {
@@ -170,6 +179,7 @@ const defaultProps = {
     dataItemEditorDataItemFilter: 'Data filter',
     dataItemEditorDataItemThresholds: 'Thresholds',
     dataItemEditorDataItemAddThreshold: 'Add threshold',
+    dataItemEditorDataItemTooltip: 'Tooltip',
     dataItemEditorBarColor: 'Bar color',
     dataItemEditorLineColor: 'Line color',
     dataItemEditorAddAggregationMethodLabel: 'Add aggregation method',
@@ -208,6 +218,13 @@ const defaultProps = {
     },
   },
   handleDataItemEdit: handleDefaultDataItemEdit,
+  options: {
+    hasColorDropdown: false,
+    hasUnit: false,
+    hasDecimalPlacesDropdown: false,
+    hasThresholds: false,
+    hasTooltip: false,
+  },
 };
 
 const DATAITEM_COLORS_OPTIONS = [
@@ -243,10 +260,18 @@ const DataSeriesFormItemModal = ({
     dataSeriesFormActions: { hasAggregationsDropDown, onAddAggregations, hasDataFilterDropdown },
   },
   handleDataItemEdit,
+  options,
 }) => {
   const mergedI18n = { ...defaultProps.i18n, ...i18n };
   const { id, type, content } = cardConfig;
   const baseClassName = `${iotPrefix}--card-edit-form`;
+  const {
+    hasColorDropdown,
+    hasUnit,
+    hasDecimalPlacesDropdown,
+    hasThresholds,
+    hasTooltip,
+  } = options;
 
   const isTimeBasedCard =
     type === CARD_TYPES.TIMESERIES ||
@@ -266,8 +291,6 @@ const DataSeriesFormItemModal = ({
         decrementNumberText,
       } = mergedI18n;
       switch (idToTranslate) {
-        default:
-          return '';
         case 'clear.all':
           return clearAllText || 'Clear all';
         case 'clear.selection':
@@ -280,6 +303,8 @@ const DataSeriesFormItemModal = ({
           return incrementNumberText || 'Increment number';
         case 'decrement.number':
           return decrementNumberText || 'Decrement number';
+        default:
+          return '';
       }
     },
     [mergedI18n]
@@ -427,7 +452,7 @@ const DataSeriesFormItemModal = ({
             />
           </div>
 
-          {(type === CARD_TYPES.TIMESERIES || type === CARD_TYPES.BAR) && ( // show color selector
+          {hasColorDropdown && ( // show color selector
             <div className={`${baseClassName}--input-group--item`}>
               <ColorDropdown
                 id={`${id}_color-dropdown`}
@@ -449,47 +474,68 @@ const DataSeriesFormItemModal = ({
               />
             </div>
           )}
-        </div>
 
-        {(type === CARD_TYPES.VALUE || type === CARD_TYPES.IMAGE) && (
-          <div className={`${baseClassName}--input-group`}>
+          {hasTooltip && (
             <div className={`${baseClassName}--input-group--item`}>
               <TextInput
-                id={`${id}_attribute-unit`}
-                labelText={mergedI18n.dataItemEditorDataItemUnit}
+                id={`${id}_attribute-tooltip`}
+                labelText={mergedI18n.dataItemEditorDataItemTooltip}
                 light
-                placeholder={`${mergedI18n.example}: %`}
                 onChange={(evt) =>
                   setEditDataItem({
                     ...editDataItem,
-                    unit: evt.target.value,
+                    tooltip: evt.target.value,
                   })
                 }
-                value={editDataItem.unit}
+                value={editDataItem.tooltip}
               />
             </div>
-            <div className={`${baseClassName}--input-group--item-end`}>
-              <Dropdown
-                id={`${id}_value-card-decimal-place`}
-                titleText={mergedI18n.decimalPlacesLabel}
-                direction="bottom"
-                label=""
-                items={[mergedI18n.notSet, '0', '1', '2', '3', '4']}
-                light
-                selectedItem={editDataItem.precision?.toString() || mergedI18n.notSet}
-                onChange={({ selectedItem }) => {
-                  const isSet = selectedItem !== mergedI18n.notSet;
-                  if (isSet) {
+          )}
+        </div>
+
+        {(hasUnit || hasDecimalPlacesDropdown) && (
+          <div className={`${baseClassName}--input-group`}>
+            {hasUnit && (
+              <div className={`${baseClassName}--input-group--item`}>
+                <TextInput
+                  id={`${id}_attribute-unit`}
+                  labelText={mergedI18n.dataItemEditorDataItemUnit}
+                  light
+                  placeholder={`${mergedI18n.example}: %`}
+                  onChange={(evt) =>
                     setEditDataItem({
                       ...editDataItem,
-                      precision: Number(selectedItem),
-                    });
-                  } else {
-                    setEditDataItem(omit(editDataItem, 'precision'));
+                      unit: evt.target.value,
+                    })
                   }
-                }}
-              />
-            </div>
+                  value={editDataItem.unit}
+                />
+              </div>
+            )}
+            {hasDecimalPlacesDropdown && (
+              <div className={`${baseClassName}--input-group--item-end`}>
+                <Dropdown
+                  id={`${id}_value-card-decimal-place`}
+                  titleText={mergedI18n.decimalPlacesLabel}
+                  direction="bottom"
+                  label=""
+                  items={[mergedI18n.notSet, '0', '1', '2', '3', '4']}
+                  light
+                  selectedItem={editDataItem.precision?.toString() || mergedI18n.notSet}
+                  onChange={({ selectedItem }) => {
+                    const isSet = selectedItem !== mergedI18n.notSet;
+                    if (isSet) {
+                      setEditDataItem({
+                        ...editDataItem,
+                        precision: Number(selectedItem),
+                      });
+                    } else {
+                      setEditDataItem(omit(editDataItem, 'precision'));
+                    }
+                  }}
+                />
+              </div>
+            )}
           </div>
         )}
 
@@ -560,7 +606,7 @@ const DataSeriesFormItemModal = ({
             </div>
           )}
 
-        {(type === CARD_TYPES.VALUE || type === CARD_TYPES.IMAGE || type === CARD_TYPES.TABLE) && (
+        {hasThresholds && (
           <ThresholdsFormItem
             id={`${id}_thresholds`}
             i18n={mergedI18n}
@@ -586,7 +632,12 @@ const DataSeriesFormItemModal = ({
       editDataItem,
       handleTranslation,
       hasAggregationsDropDown,
+      hasColorDropdown,
       hasDataFilterDropdown,
+      hasDecimalPlacesDropdown,
+      hasThresholds,
+      hasTooltip,
+      hasUnit,
       id,
       initialAggregation,
       initialGrain,
diff --git a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.test.jsx b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.test.jsx
index e7d54ea928..311873f08a 100644
--- a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.test.jsx
+++ b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItemModal.test.jsx
@@ -171,6 +171,13 @@ describe('DataSeriesFormItemModal', () => {
         onAddAggregations: jest.fn(),
       },
     },
+    options: {
+      hasColorDropdown: true,
+      hasUnit: true,
+      hasDecimalPlacesDropdown: true,
+      hasThresholds: true,
+      hasTooltip: true,
+    },
   };
 
   it('Renders for timeseries card data', () => {
@@ -189,12 +196,38 @@ describe('DataSeriesFormItemModal', () => {
     expect(label).toBeInTheDocument();
     expect(legendColorLabel).toBeInTheDocument();
 
+    const tooltip = screen.getByText('Tooltip');
+    expect(tooltip).toBeInTheDocument();
+
     const dataFilter = screen.getByRole('listbox', { name: 'Data filter' });
     expect(dataFilter).toBeInTheDocument();
 
     const aggregationDropdown = screen.getByRole('listbox', { name: 'Aggregation method' });
     expect(aggregationDropdown).toBeInTheDocument();
   });
+
+  it('Renders card data with out any options', () => {
+    render(
+      <DataSeriesFormItemModal
+        {...commonProps}
+        showEditor
+        cardConfig={valueCardConfig}
+        editDataItem={editTimeseriesDataItem}
+        editDataSeries={editDataSeriesTimeSeries}
+        options={undefined}
+      />
+    );
+
+    const label = screen.queryByText('Custom label');
+    expect(label).toBeInTheDocument();
+
+    const unit = screen.queryByText('Unit');
+    expect(unit).not.toBeInTheDocument();
+
+    const tooltip = screen.queryByText('Tooltip');
+    expect(tooltip).not.toBeInTheDocument();
+  });
+
   it('Renders for timeseries card data without datafilter', () => {
     render(
       <DataSeriesFormItemModal
diff --git a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItems/DataSeriesFormContent.jsx b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItems/DataSeriesFormContent.jsx
index 6b45b30c8f..2c25631429 100644
--- a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItems/DataSeriesFormContent.jsx
+++ b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/DataSeriesFormItems/DataSeriesFormContent.jsx
@@ -275,6 +275,7 @@ const DataSeriesFormItem = ({
   const [removedDataItems, setRemovedDataItems] = useState([]);
 
   const canMultiSelectDataItems = cardConfig.content?.type !== BAR_CHART_TYPES.SIMPLE;
+  const { type } = cardConfig;
 
   // determine which content section to look at
   const dataSection =
@@ -467,6 +468,13 @@ const DataSeriesFormItem = ({
         onChange={onChange}
         i18n={mergedI18n}
         actions={actions}
+        options={{
+          hasColorDropdown: type === CARD_TYPES.TIMESERIES || type === CARD_TYPES.BAR,
+          hasUnit: type === CARD_TYPES.VALUE,
+          hasDecimalPlacesDropdown: type === CARD_TYPES.VALUE,
+          hasThresholds: type === CARD_TYPES.VALUE,
+          hasTooltip: type === CARD_TYPES.VALUE,
+        }}
       />
       <ContentFormItemTitle
         title={mergedI18n.dataItemEditorSectionTitle}
diff --git a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/TableCardFormItems/TableCardFormContent.jsx b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/TableCardFormItems/TableCardFormContent.jsx
index 0d0b34da35..fb784743ea 100644
--- a/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/TableCardFormItems/TableCardFormContent.jsx
+++ b/packages/react/src/components/CardEditor/CardEditForm/CardEditFormItems/TableCardFormItems/TableCardFormContent.jsx
@@ -386,6 +386,13 @@ const TableCardFormContent = ({
         onChange={handleDataItemModalChanges}
         i18n={mergedI18n}
         actions={actions}
+        options={{
+          hasColorDropdown: false,
+          hasUnit: false,
+          hasDecimalPlacesDropdown: false,
+          hasThresholds: true,
+          hasTooltip: true,
+        }}
       />
       <ContentFormItemTitle
         title={mergedI18n.tableColumnEditorSectionTitle}
diff --git a/packages/react/src/components/HotspotEditorModal/HotspotEditorDataSourceTab/HotspotEditorDataSourceTab.jsx b/packages/react/src/components/HotspotEditorModal/HotspotEditorDataSourceTab/HotspotEditorDataSourceTab.jsx
index a9b40433a1..322cfc9aaa 100644
--- a/packages/react/src/components/HotspotEditorModal/HotspotEditorDataSourceTab/HotspotEditorDataSourceTab.jsx
+++ b/packages/react/src/components/HotspotEditorModal/HotspotEditorDataSourceTab/HotspotEditorDataSourceTab.jsx
@@ -203,6 +203,13 @@ const HotspotEditorDataSourceTab = ({
         onChange={onChange}
         i18n={mergedI18n}
         actions={actions}
+        options={{
+          hasColorDropdown: false,
+          hasUnit: true,
+          hasDecimalPlacesDropdown: true,
+          hasThresholds: true,
+          hasTooltip: false,
+        }}
       />
       <div className={`${baseClassName}--input`}>
         <MultiSelect
diff --git a/packages/react/src/components/TableCard/__snapshots__/TableCard.story.storyshot b/packages/react/src/components/TableCard/__snapshots__/TableCard.story.storyshot
index 581c2397b2..a530f5b16f 100644
--- a/packages/react/src/components/TableCard/__snapshots__/TableCard.story.storyshot
+++ b/packages/react/src/components/TableCard/__snapshots__/TableCard.story.storyshot
@@ -404,13 +404,29 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
                         width=""
                       >
                         <span
-                          className="bx--table-header-label"
+                          className="bx--tooltip--definition bx--tooltip--a11y"
+                          onMouseEnter={[Function]}
+                          onMouseLeave={[Function]}
                         >
+                          <button
+                            aria-describedby="table-header-tooltip"
+                            className="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition iot--table__cell-tooltip bx--tooltip--bottom bx--tooltip--align-start"
+                            onBlur={[Function]}
+                            onFocus={[Function]}
+                            type="button"
+                          >
+                            <span
+                              className=""
+                            >
+                              Count
+                            </span>
+                          </button>
                           <span
-                            className=""
-                            title="Count"
+                            className="bx--assistive-text"
+                            id="table-header-tooltip"
+                            role="tooltip"
                           >
-                            Count
+                            Counting tooltip
                           </span>
                         </span>
                         <svg
@@ -5182,13 +5198,29 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
                         width="250px"
                       >
                         <span
-                          className="bx--table-header-label"
+                          className="bx--tooltip--definition bx--tooltip--a11y"
+                          onMouseEnter={[Function]}
+                          onMouseLeave={[Function]}
                         >
+                          <button
+                            aria-describedby="table-header-tooltip"
+                            className="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition iot--table__cell-tooltip bx--tooltip--bottom bx--tooltip--align-start"
+                            onBlur={[Function]}
+                            onFocus={[Function]}
+                            type="button"
+                          >
+                            <span
+                              className=""
+                            >
+                              Count
+                            </span>
+                          </button>
                           <span
-                            className=""
-                            title="Count"
+                            className="bx--assistive-text"
+                            id="table-header-tooltip"
+                            role="tooltip"
                           >
-                            Count
+                            Counting tooltip
                           </span>
                         </span>
                         <svg
@@ -6761,13 +6793,29 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
                         width=""
                       >
                         <span
-                          className="bx--table-header-label"
+                          className="bx--tooltip--definition bx--tooltip--a11y"
+                          onMouseEnter={[Function]}
+                          onMouseLeave={[Function]}
                         >
+                          <button
+                            aria-describedby="table-header-tooltip"
+                            className="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition iot--table__cell-tooltip bx--tooltip--bottom bx--tooltip--align-start"
+                            onBlur={[Function]}
+                            onFocus={[Function]}
+                            type="button"
+                          >
+                            <span
+                              className=""
+                            >
+                              Count
+                            </span>
+                          </button>
                           <span
-                            className=""
-                            title="Count"
+                            className="bx--assistive-text"
+                            id="table-header-tooltip"
+                            role="tooltip"
                           >
-                            Count
+                            Counting tooltip
                           </span>
                         </span>
                         <svg
@@ -11161,13 +11209,29 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
                         width=""
                       >
                         <span
-                          className="bx--table-header-label"
+                          className="bx--tooltip--definition bx--tooltip--a11y"
+                          onMouseEnter={[Function]}
+                          onMouseLeave={[Function]}
                         >
+                          <button
+                            aria-describedby="table-header-tooltip"
+                            className="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition iot--table__cell-tooltip bx--tooltip--bottom bx--tooltip--align-start"
+                            onBlur={[Function]}
+                            onFocus={[Function]}
+                            type="button"
+                          >
+                            <span
+                              className=""
+                            >
+                              Count
+                            </span>
+                          </button>
                           <span
-                            className=""
-                            title="Count"
+                            className="bx--assistive-text"
+                            id="table-header-tooltip"
+                            role="tooltip"
                           >
-                            Count
+                            Counting tooltip
                           </span>
                         </span>
                         <svg
@@ -16899,13 +16963,29 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
                         width=""
                       >
                         <span
-                          className="bx--table-header-label"
+                          className="bx--tooltip--definition bx--tooltip--a11y"
+                          onMouseEnter={[Function]}
+                          onMouseLeave={[Function]}
                         >
+                          <button
+                            aria-describedby="table-header-tooltip"
+                            className="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition iot--table__cell-tooltip bx--tooltip--bottom bx--tooltip--align-start"
+                            onBlur={[Function]}
+                            onFocus={[Function]}
+                            type="button"
+                          >
+                            <span
+                              className=""
+                            >
+                              Count
+                            </span>
+                          </button>
                           <span
-                            className=""
-                            title="Count"
+                            className="bx--assistive-text"
+                            id="table-header-tooltip"
+                            role="tooltip"
                           >
-                            Count
+                            Counting tooltip
                           </span>
                         </span>
                         <svg
diff --git a/packages/react/src/components/ValueCard/Attribute.jsx b/packages/react/src/components/ValueCard/Attribute.jsx
index b90901f00d..63f456c43c 100644
--- a/packages/react/src/components/ValueCard/Attribute.jsx
+++ b/packages/react/src/components/ValueCard/Attribute.jsx
@@ -4,6 +4,7 @@ import { isNil } from 'lodash-es';
 import { CaretUp16, CaretDown16 } from '@carbon/icons-react';
 import classnames from 'classnames';
 import { gray60 } from '@carbon/colors';
+import { TooltipDefinition } from 'carbon-components-react';
 
 import { CARD_LAYOUTS } from '../../constants/LayoutConstants';
 import CardIcon from '../ImageCard/CardIcon';
@@ -30,6 +31,7 @@ const propTypes = {
         icon: PropTypes.string,
       })
     ),
+    tooltip: PropTypes.string,
   }).isRequired,
   customFormatter: PropTypes.func,
   isEditable: PropTypes.bool,
@@ -75,7 +77,7 @@ const BEM_BASE = `${BASE_CLASS_NAME}__attribute`;
  * He also determines which threshold applies to a given attribute (perhaps that should be moved)
  */
 const Attribute = ({
-  attribute: { label, unit, thresholds, precision, dataSourceId, measurementUnitLabel },
+  attribute: { label, unit, thresholds, precision, dataSourceId, measurementUnitLabel, tooltip },
   attributeCount,
   customFormatter,
   isEditable,
@@ -123,7 +125,13 @@ const Attribute = ({
             testId={`${testId}-threshold-icon`}
           />
         ) : null}
-        <span data-testid={`${testId}-threshold-label`}>{label}</span>
+        {tooltip ? (
+          <TooltipDefinition direction="right" tooltipText={tooltip}>
+            {label}
+          </TooltipDefinition>
+        ) : (
+          <span data-testid={`${testId}-threshold-label`}>{label}</span>
+        )}
       </div>
 
       <div className={`${BEM_BASE}`}>
diff --git a/packages/react/src/components/ValueCard/ValueCard.story.jsx b/packages/react/src/components/ValueCard/ValueCard.story.jsx
index a4c908dbf1..c4e7e698b4 100644
--- a/packages/react/src/components/ValueCard/ValueCard.story.jsx
+++ b/packages/react/src/components/ValueCard/ValueCard.story.jsx
@@ -152,6 +152,7 @@ export const WithLinkAndMeasurementUnit = () => {
             {
               dataSourceId: 'peakUsage',
               label: text('content.attributes[0].label', 'Peak usage'),
+              tooltip: text('content.attributes[0].tooltip', 'Peak usage tooltip'),
               measurementUnitLabel: text('content.attributes[0].measurementUnitLabel', 'AppPoints'),
               thresholds: [
                 {
diff --git a/packages/react/src/components/ValueCard/__snapshots__/ValueCard.story.storyshot b/packages/react/src/components/ValueCard/__snapshots__/ValueCard.story.storyshot
index b4fe9aa283..95be06f549 100644
--- a/packages/react/src/components/ValueCard/__snapshots__/ValueCard.story.storyshot
+++ b/packages/react/src/components/ValueCard/__snapshots__/ValueCard.story.storyshot
@@ -1281,9 +1281,26 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
                 </title>
               </svg>
               <span
-                data-testid="Card-attribute-0-threshold-label"
+                className="bx--tooltip--definition bx--tooltip--a11y"
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
               >
-                Peak usage
+                <button
+                  aria-describedby="definition-tooltip-21"
+                  className="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition bx--tooltip--right bx--tooltip--align-start"
+                  onBlur={[Function]}
+                  onFocus={[Function]}
+                  type="button"
+                >
+                  Peak usage
+                </button>
+                <span
+                  className="bx--assistive-text"
+                  id="definition-tooltip-21"
+                  role="tooltip"
+                >
+                  Peak usage tooltip
+                </span>
               </span>
             </div>
             <div
diff --git a/packages/react/src/utils/sample.jsx b/packages/react/src/utils/sample.jsx
index 0ad5eac6bf..b603b88e8f 100644
--- a/packages/react/src/utils/sample.jsx
+++ b/packages/react/src/utils/sample.jsx
@@ -2523,6 +2523,7 @@ export const tableColumns = [
   {
     dataSourceId: 'count',
     label: 'Count',
+    tooltip: 'Counting tooltip',
     priority: 3,
     filter: { placeholderText: 'enter a string' },
   },