diff --git a/src/components/NewPosition/RangeSelector/RangeSelector.tsx b/src/components/NewPosition/RangeSelector/RangeSelector.tsx
index 13fe35b1a..f77e26170 100644
--- a/src/components/NewPosition/RangeSelector/RangeSelector.tsx
+++ b/src/components/NewPosition/RangeSelector/RangeSelector.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef } from 'react'
+import React, { useState, useEffect, useRef, useMemo } from 'react'
 import PriceRangePlot, { TickPlotPositionData } from '@common/PriceRangePlot/PriceRangePlot'
 import RangeInput from '@components/Inputs/RangeInput/RangeInput'
 import { PlotTickData } from '@store/reducers/positions'
@@ -21,6 +21,7 @@ import { getMaxTick, getMinTick } from '@invariant-labs/sdk/lib/utils'
 import { Button, Grid, Typography } from '@mui/material'
 import icons from '@static/icons'
 import { TooltipGradient } from '@common/TooltipHover/TooltipGradient'
+import { colors } from '@static/theme'
 
 export interface IRangeSelector {
   updatePath: (concIndex: number) => void
@@ -423,6 +424,28 @@ export const RangeSelector: React.FC<IRangeSelector> = ({
     autoZoomHandler(leftRange, rightRange, true)
   }, [tokenASymbol, tokenBSymbol])
 
+  const buyPercentageDifference = useMemo(() => {
+    if (
+      tokenAPriceData?.buyPrice === undefined ||
+      globalPrice === undefined ||
+      tokenBPriceData?.price === undefined
+    ) {
+      return
+    }
+    return ((tokenAPriceData.buyPrice / tokenBPriceData?.price - globalPrice) / globalPrice) * 100
+  }, [tokenAPriceData?.buyPrice, globalPrice, tokenBPriceData?.price])
+
+  const sellPercentageDifference = useMemo(() => {
+    if (
+      tokenAPriceData?.sellPrice === undefined ||
+      globalPrice === undefined ||
+      tokenBPriceData?.price === undefined
+    ) {
+      return
+    }
+    return ((tokenAPriceData.sellPrice / tokenBPriceData?.price - globalPrice) / globalPrice) * 100
+  }, [tokenAPriceData?.sellPrice, globalPrice, tokenBPriceData?.price])
+
   return (
     <Grid container className={classes.wrapper}>
       <Grid className={classes.topInnerWrapper}>
@@ -430,9 +453,42 @@ export const RangeSelector: React.FC<IRangeSelector> = ({
           <Grid>
             <Typography className={classes.header}>Price range</Typography>
             {poolIndex !== null && (
-              <Typography className={classes.currentPrice}>
-                {formatNumberWithoutSuffix(midPrice.x)} {tokenBSymbol} per {tokenASymbol}
-              </Typography>
+              <>
+                <div className={classes.priceBlock}>
+                  <Typography className={classes.currentPrice}>
+                    {formatNumberWithoutSuffix(midPrice.x)} {tokenASymbol}/{tokenBSymbol}
+                  </Typography>
+                </div>
+                <div className={classes.priceBlock}>
+                  {globalPrice && (
+                    <Typography
+                      className={classes.currentPrice}
+                      style={{ color: colors.invariant.blue }}>
+                      {formatNumberWithoutSuffix(globalPrice)} {tokenASymbol}/{tokenBSymbol}
+                    </Typography>
+                  )}
+                </div>
+                <div className={classes.priceBlock}>
+                  {buyPercentageDifference && (
+                    <Typography
+                      className={classes.currentPrice}
+                      style={{ color: colors.invariant.plotGreen }}>
+                      {buyPercentageDifference < 0 ? '-' : '+'}
+                      {formatNumberWithoutSuffix(Math.abs(buyPercentageDifference))}%
+                    </Typography>
+                  )}
+                </div>
+                <div className={classes.priceBlock}>
+                  {sellPercentageDifference && (
+                    <Typography
+                      className={classes.currentPrice}
+                      style={{ color: colors.invariant.plotRed }}>
+                      {sellPercentageDifference < 0 ? '-' : '+'}{' '}
+                      {formatNumberWithoutSuffix(Math.abs(sellPercentageDifference))}%
+                    </Typography>
+                  )}
+                </div>
+              </>
             )}
           </Grid>
           <Grid className={classes.activeLiquidityContainer} container>
@@ -468,7 +524,7 @@ export const RangeSelector: React.FC<IRangeSelector> = ({
                 Active liquidity <span className={classes.activeLiquidityIcon}>i</span>
               </Typography>
             </TooltipGradient>
-            <Grid container flexDirection='column'>
+            <Grid container flexDirection='column' mt={'3px'}>
               <Typography className={classes.currentPrice}>Current price</Typography>
               <Typography className={classes.globalPrice}>Global price</Typography>
               <Typography className={classes.lastGlobalBuyPrice}>Last global buy price</Typography>
diff --git a/src/components/NewPosition/RangeSelector/style.ts b/src/components/NewPosition/RangeSelector/style.ts
index d6aa07cb0..f1f7715a5 100644
--- a/src/components/NewPosition/RangeSelector/style.ts
+++ b/src/components/NewPosition/RangeSelector/style.ts
@@ -296,6 +296,11 @@ const useStyles = makeStyles()(theme => {
         minWidth: 82,
         textAlign: 'center'
       }
+    },
+    priceBlock: {
+      height: 17,
+      margin: 0,
+      textAlign: 'left'
     }
   }
 })
diff --git a/src/components/PositionDetails/SinglePositionPlot/SinglePositionPlot.tsx b/src/components/PositionDetails/SinglePositionPlot/SinglePositionPlot.tsx
index 482c1705a..aac14db3c 100644
--- a/src/components/PositionDetails/SinglePositionPlot/SinglePositionPlot.tsx
+++ b/src/components/PositionDetails/SinglePositionPlot/SinglePositionPlot.tsx
@@ -4,6 +4,7 @@ import {
   calcPriceByTickIndex,
   calcTicksAmountInRange,
   calculateConcentration,
+  formatNumberWithoutSuffix,
   formatNumberWithSuffix,
   numberToString,
   spacingMultiplicityGte,
@@ -11,7 +12,7 @@ import {
   truncateString
 } from '@utils/utils'
 import { PlotTickData } from '@store/reducers/positions'
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useMemo, useState } from 'react'
 
 import useStyles from './style'
 import { getMinTick } from '@invariant-labs/sdk/lib/utils'
@@ -159,10 +160,72 @@ const SinglePositionPlot: React.FC<ISinglePositionPlot> = ({
   const maxPercentage = (max / currentPrice - 1) * 100
   const concentration = calculateConcentration(leftRange.index, rightRange.index)
 
+  const buyPercentageDifference = useMemo(() => {
+    if (
+      tokenAPriceData?.buyPrice === undefined ||
+      globalPrice === undefined ||
+      tokenBPriceData?.price === undefined
+    ) {
+      return
+    }
+    return ((tokenAPriceData.buyPrice / tokenBPriceData?.price - globalPrice) / globalPrice) * 100
+  }, [tokenAPriceData?.buyPrice, globalPrice, tokenBPriceData?.price])
+
+  const sellPercentageDifference = useMemo(() => {
+    if (
+      tokenAPriceData?.sellPrice === undefined ||
+      globalPrice === undefined ||
+      tokenBPriceData?.price === undefined
+    ) {
+      return
+    }
+    return ((tokenAPriceData.sellPrice / tokenBPriceData?.price - globalPrice) / globalPrice) * 100
+  }, [tokenAPriceData?.sellPrice, globalPrice, tokenBPriceData?.price])
+
   return (
     <Box className={classes.container}>
       <Box className={classes.headerContainer}>
-        <Typography className={classes.header}>Price range</Typography>
+        <Grid>
+          <Typography className={classes.header}>Price range</Typography>
+          {
+            <>
+              <div className={classes.priceBlock}>
+                <Typography className={classes.currentPrice}>
+                  {formatNumberWithoutSuffix(midPrice.x)} {tokenX.name}/{tokenY.name}
+                </Typography>
+              </div>
+              <div className={classes.priceBlock}>
+                {globalPrice && (
+                  <Typography
+                    className={classes.currentPrice}
+                    style={{ color: colors.invariant.blue }}>
+                    {formatNumberWithoutSuffix(globalPrice)} {tokenX.name}/{tokenY.name}
+                  </Typography>
+                )}
+              </div>
+              <div className={classes.priceBlock}>
+                {buyPercentageDifference && (
+                  <Typography
+                    className={classes.currentPrice}
+                    style={{ color: colors.invariant.plotGreen }}>
+                    {buyPercentageDifference < 0 ? '-' : '+'}
+                    {formatNumberWithoutSuffix(Math.abs(buyPercentageDifference))}%
+                  </Typography>
+                )}
+              </div>
+              <div className={classes.priceBlock}>
+                {sellPercentageDifference && (
+                  <Typography
+                    className={classes.currentPrice}
+                    style={{ color: colors.invariant.plotRed }}>
+                    {sellPercentageDifference < 0 ? '-' : '+'}{' '}
+                    {formatNumberWithoutSuffix(Math.abs(sellPercentageDifference))}%
+                  </Typography>
+                )}
+              </div>
+            </>
+          }
+        </Grid>
         <Grid>
           <RangeIndicator inRange={min <= currentPrice && currentPrice <= max} />
           <Grid gap={'2px'} mt={1} display='flex' flexDirection='column' alignItems='flex-end'>
diff --git a/src/components/PositionDetails/SinglePositionPlot/style.ts b/src/components/PositionDetails/SinglePositionPlot/style.ts
index ece7c6ce1..1c63f86cf 100644
--- a/src/components/PositionDetails/SinglePositionPlot/style.ts
+++ b/src/components/PositionDetails/SinglePositionPlot/style.ts
@@ -34,7 +34,8 @@ export const useStyles = makeStyles()((theme: Theme) => ({
   },
   header: {
     ...typography.heading4,
-    color: colors.white.main
+    color: colors.white.main,
+    marginBottom: 28
   },
   plot: {
     width: '100%',
@@ -114,6 +115,7 @@ export const useStyles = makeStyles()((theme: Theme) => ({
     marginLeft: 16
   },
   currentPrice: {
+    display: 'inline-block',
     color: colors.invariant.yellow,
     ...typography.caption2,
     textAlign: 'right'
@@ -162,6 +164,11 @@ export const useStyles = makeStyles()((theme: Theme) => ({
     ...typography.caption2,
     textAlign: 'right',
     marginLeft: 4
+  },
+  priceBlock: {
+    height: 17,
+    margin: 0,
+    textAlign: 'left'
   }
 }))