diff --git a/src/chart/canvas/canvas-bounds-container.ts b/src/chart/canvas/canvas-bounds-container.ts
index 7ab2269..8b20fd4 100644
--- a/src/chart/canvas/canvas-bounds-container.ts
+++ b/src/chart/canvas/canvas-bounds-container.ts
@@ -764,10 +764,10 @@ export class CanvasBoundsContainer {
 	/**
 	 * Gets hit-test fn for canvas element.
 	 * @param {string} el - CanvasElement.ELEMENT_NAME
-	 * @param {boolean} reverse - reverses the hit test condition
-	 * @param {number} extensionX - extended hitBoundsTest in horizontal direction
-	 * @param {number} extensionY - extended hitBoundsTest in vertical direction
-	 * @param wholePage
+	 * @param {Object} options - An object containing options for the hit test.
+	 * @param {number} [options.extensionX=0] - The amount of extension in the x-axis.
+	 * @param {number} [options.extensionY=0] - The amount of extension in the y-axis.
+	 * @param {boolean} [options.wholePage=false] - Whether to test against the whole page or just the bounds object.
 	 * @return {HitBoundsTest} hit-test fn
 	 */
 	getBoundsHitTest(el: string, options: AtLeastOne<HitBoundsTestOptions> = DEFAULT_HIT_TEST_OPTIONS): HitBoundsTest {
diff --git a/src/chart/chart.config.ts b/src/chart/chart.config.ts
index 3474e21..56d2373 100644
--- a/src/chart/chart.config.ts
+++ b/src/chart/chart.config.ts
@@ -437,7 +437,7 @@ export const getDefaultConfig = (): FullChartConfig => ({
 		highLowTheme: { highColor: 'rgba(223,222,223,1)', lowColor: 'rgba(223,222,223,1)' },
 		instrumentInfo: { textColor: '#aeb1b3' },
 		paneResizer: {
-			lineColor: 'rgba(55,55,54,1)',
+			lineColor: 'rgba(61,61,61,1)',
 			bgColor: 'rgba(20,20,19,1)',
 			bgHoverColor: 'rgba(55,55,54,0.6)',
 		},
diff --git a/src/chart/components/pane/pane-manager.component.ts b/src/chart/components/pane/pane-manager.component.ts
index 8f6c45e..585db44 100644
--- a/src/chart/components/pane/pane-manager.component.ts
+++ b/src/chart/components/pane/pane-manager.component.ts
@@ -20,7 +20,7 @@ import { uuid as generateUuid } from '../../utils/uuid.utils';
 import { ChartBaseModel } from '../chart/chart-base.model';
 import { createHighLowOffsetCalculator } from '../chart/data-series.high-low-provider';
 import { ChartPanComponent } from '../pan/chart-pan.component';
-import { BarResizerComponent } from '../resizer/bar-resizer.component';
+import { BarResizerComponent, RESIZER_HIT_TEST_EXTENSION } from '../resizer/bar-resizer.component';
 import {
 	YExtentComponent,
 	YExtentCreationOptions,
@@ -97,7 +97,7 @@ export class PaneManager extends ChartBaseElement {
 	 */
 	private addResizer(uuid: string) {
 		const resizerHT = this.canvasBoundsContainer.getBoundsHitTest(CanvasElement.PANE_UUID_RESIZER(uuid), {
-			extensionY: this.config.components.paneResizer.dragZone,
+			extensionY: this.config.components.paneResizer.dragZone + RESIZER_HIT_TEST_EXTENSION,
 		});
 		const dragPredicate = () => this.chartBaseModel.mainVisualPoints.length !== 0;
 		const dragTick = () => {
@@ -335,7 +335,7 @@ export class PaneManager extends ChartBaseElement {
 			this.cursorHandler.setCursorForCanvasEl(
 				paneResizer,
 				this.config.components.paneResizer.cursor,
-				this.config.components.paneResizer.dragZone,
+				this.config.components.paneResizer.dragZone + RESIZER_HIT_TEST_EXTENSION,
 			);
 
 		return () => {
diff --git a/src/chart/components/resizer/bar-resizer.component.ts b/src/chart/components/resizer/bar-resizer.component.ts
index 3a6985c..74ad02e 100644
--- a/src/chart/components/resizer/bar-resizer.component.ts
+++ b/src/chart/components/resizer/bar-resizer.component.ts
@@ -19,6 +19,8 @@ import { BarResizerDrawer } from './bar-resizer.drawer';
 import { BoundsProvider } from '../../model/bounds.model';
 import { HitTestCanvasModel } from '../../model/hit-test-canvas.model';
 
+export const RESIZER_HIT_TEST_EXTENSION: number = 8;
+
 /**
  * Bar separator between panes.
  * Used to resize the areas height or just draw a fixed line.