diff --git a/changelogs/fragments/8504.yml b/changelogs/fragments/8504.yml
new file mode 100644
index 000000000000..3ccc6590581d
--- /dev/null
+++ b/changelogs/fragments/8504.yml
@@ -0,0 +1,6 @@
+feat:
+- Allow hiding the TSVB axis for time series visualizations ([#8504](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8504))
+- Allow setting scale of each axis for TSVB time series ([#8504](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8504))
+
+fix:
+- Compress non-OUI input fields in TSVB visualizations ([#8504](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8504))
\ No newline at end of file
diff --git a/src/plugins/vis_type_timeseries/public/application/components/aggs/_agg_row.scss b/src/plugins/vis_type_timeseries/public/application/components/aggs/_agg_row.scss
index f021d0f1905a..13c874435d36 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/aggs/_agg_row.scss
+++ b/src/plugins/vis_type_timeseries/public/application/components/aggs/_agg_row.scss
@@ -17,7 +17,3 @@
 .tvbAggRow__unavailable {
   margin-top: -$euiSizeXS;
 }
-
-.tvbAgg__input {
-  @include euiFormControlStyle($borderOnly: false, $includeStates: true, $includeSizes: false);
-}
diff --git a/src/plugins/vis_type_timeseries/public/application/components/aggs/moving_average.js b/src/plugins/vis_type_timeseries/public/application/components/aggs/moving_average.js
index 22254d3d4a08..cdc80d0650a9 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/aggs/moving_average.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/aggs/moving_average.js
@@ -45,6 +45,7 @@ import {
   EuiSpacer,
   EuiCompressedFormRow,
   EuiCompressedFieldNumber,
+  EuiFormControlLayout,
 } from '@elastic/eui';
 import { i18n } from '@osd/i18n';
 import { MODEL_TYPES } from '../../../../common/model_options';
@@ -207,16 +208,18 @@ export const MovingAverageAgg = (props) => {
               })
             }
           >
-            {/*
-              EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-              Should it be text or number?
-            */}
-            <input
-              className="tvbAgg__input"
-              type="text"
-              onChange={handleNumberChange('window')}
-              value={model.window}
-            />
+            <EuiFormControlLayout compressed={true}>
+              {/*
+                EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                Should it be text or number?
+              */}
+              <input
+                className="euiFieldText euiFieldText--compressed"
+                type="text"
+                onChange={handleNumberChange('window')}
+                value={model.window}
+              />
+            </EuiFormControlLayout>
           </EuiCompressedFormRow>
         </EuiFlexItem>
       </EuiFlexGroup>
diff --git a/src/plugins/vis_type_timeseries/public/application/components/aggs/serial_diff.js b/src/plugins/vis_type_timeseries/public/application/components/aggs/serial_diff.js
index b3fb682d7bb6..dfc8b9101605 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/aggs/serial_diff.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/aggs/serial_diff.js
@@ -43,6 +43,7 @@ import {
   EuiFormLabel,
   EuiCompressedFormRow,
   EuiSpacer,
+  EuiFormControlLayout,
 } from '@elastic/eui';
 import { FormattedMessage } from '@osd/i18n/react';
 import { useOpenSearchDashboards } from '../../../../../opensearch_dashboards_react/public';
@@ -117,16 +118,18 @@ export const SerialDiffAgg = (props) => {
               />
             }
           >
-            {/*
-              EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-              Should it be text or number?
-            */}
-            <input
-              className="tvbAgg__input"
-              onChange={handleNumberChange('lag')}
-              value={model.lag}
-              type="text"
-            />
+            <EuiFormControlLayout compressed={true}>
+              {/*
+                EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                Should it be text or number?
+              */}
+              <input
+                className="euiFieldText euiFieldText--compressed"
+                onChange={handleNumberChange('lag')}
+                value={model.lag}
+                type="text"
+              />
+            </EuiFormControlLayout>
           </EuiCompressedFormRow>
         </EuiFlexItem>
       </EuiFlexGroup>
diff --git a/src/plugins/vis_type_timeseries/public/application/components/aggs/top_hit.js b/src/plugins/vis_type_timeseries/public/application/components/aggs/top_hit.js
index 7580c1c881bd..65ed49714a6e 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/aggs/top_hit.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/aggs/top_hit.js
@@ -44,6 +44,7 @@ import {
   EuiCompressedComboBox,
   EuiSpacer,
   EuiCompressedFormRow,
+  EuiFormControlLayout,
 } from '@elastic/eui';
 import { injectI18n, FormattedMessage } from '@osd/i18n/react';
 import { OSD_FIELD_TYPES } from '../../../../../../plugins/data/public';
@@ -206,15 +207,17 @@ const TopHitAggUi = (props) => {
               <FormattedMessage id="visTypeTimeseries.topHit.sizeLabel" defaultMessage="Size" />
             }
           >
-            {/*
-              EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-              Should it be text or number?
-            */}
-            <input
-              className="tvbAgg__input"
-              value={model.size}
-              onChange={handleTextChange('size')}
-            />
+            <EuiFormControlLayout compressed={true}>
+              {/*
+                EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                Should it be text or number?
+              */}
+              <input
+                className="euiFieldText euiFieldText--compressed"
+                value={model.size}
+                onChange={handleTextChange('size')}
+              />
+            </EuiFormControlLayout>
           </EuiCompressedFormRow>
         </EuiFlexItem>
         <EuiFlexItem>
diff --git a/src/plugins/vis_type_timeseries/public/application/components/panel_config/gauge.js b/src/plugins/vis_type_timeseries/public/application/components/panel_config/gauge.js
index d623915074a9..1d2b32a035d4 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/panel_config/gauge.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/panel_config/gauge.js
@@ -52,6 +52,7 @@ import {
   EuiCompressedFieldNumber,
   EuiTitle,
   EuiHorizontalRule,
+  EuiFormControlLayout,
 } from '@elastic/eui';
 import { injectI18n, FormattedMessage } from '@osd/i18n/react';
 import { QueryBarWrapper } from '../query_bar_wrapper';
@@ -215,17 +216,19 @@ class GaugePanelConfigUi extends Component {
                     />
                   }
                 >
-                  {/*
-                    EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-                    It accepts a null value, but is passed a empty string.
-                  */}
-                  <input
-                    id={htmlId('gaugeMax')}
-                    className="tvbAgg__input"
-                    type="number"
-                    onChange={handleTextChange('gauge_max')}
-                    value={model.gauge_max}
-                  />
+                  <EuiFormControlLayout compressed={true}>
+                    {/*
+                      EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                      It accepts a null value, but is passed a empty string.
+                    */}
+                    <input
+                      id={htmlId('gaugeMax')}
+                      className="euiFieldText euiFieldText--compressed"
+                      type="number"
+                      onChange={handleTextChange('gauge_max')}
+                      value={model.gauge_max}
+                    />
+                  </EuiFormControlLayout>
                 </EuiCompressedFormRow>
               </EuiFlexItem>
               <EuiFlexItem>
diff --git a/src/plugins/vis_type_timeseries/public/application/components/panel_config/table.js b/src/plugins/vis_type_timeseries/public/application/components/panel_config/table.js
index e5ce1e9f9865..a7fef70aeaed 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/panel_config/table.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/panel_config/table.js
@@ -52,6 +52,7 @@ import {
   EuiHorizontalRule,
   EuiCode,
   EuiText,
+  EuiFormControlLayout,
 } from '@elastic/eui';
 import { FormattedMessage } from '@osd/i18n/react';
 import { QueryBarWrapper } from '../query_bar_wrapper';
@@ -164,16 +165,18 @@ export class TablePanelConfig extends Component {
                       />
                     }
                   >
-                    {/*
-                      EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-                      Should it be number or string?
-                    */}
-                    <input
-                      className="tvbAgg__input"
-                      type="number"
-                      onChange={handleTextChange('pivot_rows')}
-                      value={model.pivot_rows}
-                    />
+                    <EuiFormControlLayout compressed={true}>
+                      {/*
+                        EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                        Should it be number or string?
+                      */}
+                      <input
+                        className="euiFieldText euiFieldText--compressed"
+                        type="number"
+                        onChange={handleTextChange('pivot_rows')}
+                        value={model.pivot_rows}
+                      />
+                    </EuiFormControlLayout>
                   </EuiCompressedFormRow>
                 </EuiFlexItem>
               </EuiFlexGroup>
diff --git a/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.js b/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.js
index ac95f5450df1..09c094178502 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.js
@@ -48,7 +48,7 @@ import {
   EuiCompressedFormRow,
   EuiFormLabel,
   EuiSpacer,
-  EuiCompressedFieldText,
+  EuiCompressedFieldNumber,
   EuiTitle,
   EuiHorizontalRule,
 } from '@elastic/eui';
@@ -271,7 +271,7 @@ class TimeseriesPanelConfigUi extends Component {
                     />
                   }
                 >
-                  <EuiCompressedFieldText
+                  <EuiCompressedFieldNumber
                     onChange={handleTextChange('axis_min')}
                     value={model.axis_min}
                   />
@@ -287,7 +287,7 @@ class TimeseriesPanelConfigUi extends Component {
                     />
                   }
                 >
-                  <EuiCompressedFieldText
+                  <EuiCompressedFieldNumber
                     onChange={handleTextChange('axis_max')}
                     value={model.axis_max}
                   />
diff --git a/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/config.js b/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/config.js
index d0a4af543610..41dd2fee0bc2 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/config.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/config.js
@@ -47,13 +47,14 @@ import {
   EuiCompressedFieldNumber,
   EuiFormLabel,
   EuiSpacer,
+  EuiFormControlLayout,
 } from '@elastic/eui';
 import { FormattedMessage, injectI18n } from '@osd/i18n/react';
 import { getDefaultQueryLanguage } from '../../lib/get_default_query_language';
 import { QueryBarWrapper } from '../../query_bar_wrapper';
 
 import { isPercentDisabled } from '../../lib/stacked';
-import { STACKED_OPTIONS } from '../../../visualizations/constants/chart';
+import { STACKED_OPTIONS, AXIS_POSITION } from '../../../visualizations/constants/chart';
 
 export const TimeseriesConfig = injectI18n(function (props) {
   const handleSelectChange = createSelectHandler(props.onChange);
@@ -114,20 +115,48 @@ export const TimeseriesConfig = injectI18n(function (props) {
         id: 'visTypeTimeseries.timeSeries.rightLabel',
         defaultMessage: 'Right',
       }),
-      value: 'right',
+      value: AXIS_POSITION.RIGHT,
     },
     {
       label: intl.formatMessage({
         id: 'visTypeTimeseries.timeSeries.leftLabel',
         defaultMessage: 'Left',
       }),
-      value: 'left',
+      value: AXIS_POSITION.LEFT,
+    },
+    {
+      label: intl.formatMessage({
+        id: 'visTypeTimeseries.timeSeries.hiddenLabel',
+        defaultMessage: 'Hidden',
+      }),
+      value: AXIS_POSITION.HIDDEN,
     },
   ];
+
   const selectedAxisPosOption = positionOptions.find((option) => {
     return model.axis_position === option.value;
   });
 
+  const scaleOptions = [
+    {
+      label: intl.formatMessage({
+        id: 'visTypeTimeseries.timeseries.scaleOptions.normalLabel',
+        defaultMessage: 'Normal',
+      }),
+      value: 'normal',
+    },
+    {
+      label: intl.formatMessage({
+        id: 'visTypeTimeseries.timeseries.scaleOptions.logLabel',
+        defaultMessage: 'Log',
+      }),
+      value: 'log',
+    },
+  ];
+  const selectedAxisScaleOption = scaleOptions.find((option) => {
+    return model.axis_scale === option.value;
+  });
+
   const chartTypeOptions = [
     {
       label: intl.formatMessage({
@@ -505,17 +534,19 @@ export const TimeseriesConfig = injectI18n(function (props) {
               />
             }
           >
-            {/*
-              EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-              It accepts a null value, but is passed a empty string.
-            */}
-            <input
-              className="tvbAgg__input"
-              type="number"
-              disabled={disableSeparateYaxis}
-              onChange={handleTextChange('axis_min')}
-              value={model.axis_min}
-            />
+            <EuiFormControlLayout compressed={true}>
+              {/*
+                EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                It accepts a null value, but is passed a empty string.
+              */}
+              <input
+                className="euiFieldText euiFieldText--compressed"
+                type="number"
+                disabled={disableSeparateYaxis}
+                onChange={handleTextChange('axis_min')}
+                value={model.axis_min}
+              />
+            </EuiFormControlLayout>
           </EuiCompressedFormRow>
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
@@ -528,16 +559,19 @@ export const TimeseriesConfig = injectI18n(function (props) {
               />
             }
           >
-            {/*
-              EUITODO: The following input couldn't be converted to EUI because of type mis-match.
-              It accepts a null value, but is passed a empty string.
-            */}
-            <input
-              className="tvbAgg__input"
-              disabled={disableSeparateYaxis}
-              onChange={handleTextChange('axis_max')}
-              value={model.axis_max}
-            />
+            <EuiFormControlLayout compressed={true}>
+              {/*
+                EUITODO: The following input couldn't be converted to EUI because of type mis-match.
+                It accepts a null value, but is passed a empty string.
+              */}
+              <input
+                className="euiFieldText euiFieldText--compressed"
+                type="number"
+                disabled={disableSeparateYaxis}
+                onChange={handleTextChange('axis_max')}
+                value={model.axis_max}
+              />
+            </EuiFormControlLayout>
           </EuiCompressedFormRow>
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
@@ -560,6 +594,26 @@ export const TimeseriesConfig = injectI18n(function (props) {
             />
           </EuiCompressedFormRow>
         </EuiFlexItem>
+        <EuiFlexItem grow={false}>
+          <EuiCompressedFormRow
+            id={htmlId('axisScale')}
+            label={
+              <FormattedMessage
+                id="visTypeTimeseries.timeseries.optionsTab.axisScaleLabel"
+                defaultMessage="Axis scale"
+              />
+            }
+          >
+            <EuiCompressedComboBox
+              isClearable={false}
+              isDisabled={disableSeparateYaxis}
+              options={scaleOptions}
+              selectedOptions={selectedAxisScaleOption ? [selectedAxisScaleOption] : []}
+              onChange={handleSelectChange('axis_scale')}
+              singleSelection={{ asPlainText: true }}
+            />
+          </EuiCompressedFormRow>
+        </EuiFlexItem>
       </EuiFlexGroup>
 
       <EuiHorizontalRule margin="s" />
diff --git a/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js b/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js
index db0dc4de77a6..cbf293cb1781 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js
@@ -43,7 +43,7 @@ import { replaceVars } from '../../lib/replace_vars';
 import { getAxisLabelString } from '../../lib/get_axis_label_string';
 import { getInterval } from '../../lib/get_interval';
 import { createXaxisFormatter } from '../../lib/create_xaxis_formatter';
-import { STACKED_OPTIONS } from '../../../visualizations/constants';
+import { STACKED_OPTIONS, AXIS_POSITION } from '../../../visualizations/constants';
 import { getCoreStart } from '../../../../services';
 
 export class TimeseriesVisualization extends Component {
@@ -202,7 +202,11 @@ export class TimeseriesVisualization extends Component {
         seriesGroup.axisFormatter = 'percent';
         seriesGroup.axis_min = seriesGroup.axis_min || 0;
         seriesGroup.axis_max = seriesGroup.axis_max || 1;
-        seriesGroup.axis_position = model.axis_position;
+        // If the axis is hidden, arbitrarily set it to left
+        seriesGroup.axis_position =
+          seriesGroup.axis_position === AXIS_POSITION.HIDDEN
+            ? AXIS_POSITION.LEFT
+            : model.axis_position;
       }
 
       series
@@ -219,8 +223,11 @@ export class TimeseriesVisualization extends Component {
           domain,
           groupId,
           id: yAxisIdGenerator(seriesGroup.id),
-          position: seriesGroup.axis_position,
-          hide: isStackedWithinSeries,
+          position:
+            seriesGroup.axis_position === AXIS_POSITION.HIDDEN
+              ? AXIS_POSITION.LEFT
+              : seriesGroup.axis_position,
+          hide: isStackedWithinSeries || seriesGroup.axis_position === AXIS_POSITION.HIDDEN,
           tickFormatter:
             seriesGroup.stacked === STACKED_OPTIONS.PERCENT
               ? this.yAxisStackedByPercentFormatter
@@ -231,7 +238,11 @@ export class TimeseriesVisualization extends Component {
           tickFormatter: allSeriesHaveSameFormatters ? seriesGroupTickFormatter : (val) => val,
           id: yAxisIdGenerator('main'),
           groupId: mainAxisGroupId,
-          position: model.axis_position,
+          position:
+            seriesGroup.axis_position === AXIS_POSITION.HIDDEN
+              ? AXIS_POSITION.LEFT
+              : model.axis_position,
+          hide: seriesGroup.axis_position === AXIS_POSITION.HIDDEN,
           domain: mainAxisDomain,
         });
 
diff --git a/src/plugins/vis_type_timeseries/public/application/visualizations/constants/chart.js b/src/plugins/vis_type_timeseries/public/application/visualizations/constants/chart.js
index a9a82d5c2bef..a21111cad21d 100644
--- a/src/plugins/vis_type_timeseries/public/application/visualizations/constants/chart.js
+++ b/src/plugins/vis_type_timeseries/public/application/visualizations/constants/chart.js
@@ -51,3 +51,9 @@ export const STACKED_OPTIONS = {
   STACKED: 'stacked',
   STACKED_WITHIN_SERIES: 'stacked_within_series',
 };
+
+export const AXIS_POSITION = {
+  LEFT: 'left',
+  RIGHT: 'right',
+  HIDDEN: 'hidden',
+};
diff --git a/src/plugins/vis_type_timeseries/public/metrics_type.ts b/src/plugins/vis_type_timeseries/public/metrics_type.ts
index ed3ea21c25e2..337689e2f57d 100644
--- a/src/plugins/vis_type_timeseries/public/metrics_type.ts
+++ b/src/plugins/vis_type_timeseries/public/metrics_type.ts
@@ -65,6 +65,7 @@ export const metricsVisDefinition = {
           ],
           separate_axis: 0,
           axis_position: 'right',
+          axis_scale: 'normal',
           formatter: 'number',
           chart_type: 'line',
           line_width: 1,