diff --git a/apps/trading/client-pages/portfolio/account-history-container.tsx b/apps/trading/client-pages/portfolio/account-history-container.tsx
index f83695dec..baa1e7bc4 100644
--- a/apps/trading/client-pages/portfolio/account-history-container.tsx
+++ b/apps/trading/client-pages/portfolio/account-history-container.tsx
@@ -301,7 +301,7 @@ export const AccountHistoryChart = ({
   asset: AssetFieldsFragment;
 }) => {
   const { theme } = useThemeSwitcher();
-  const values: { cols: string[]; rows: [Date, ...number[]][] } | null =
+  const values: { cols: [string, string]; rows: [Date, number][] } | null =
     useMemo(() => {
       if (!data?.balanceChanges.edges.length) {
         return null;
diff --git a/apps/trading/pages/styles.css b/apps/trading/pages/styles.css
index a67f00a4d..dab5d4ba0 100644
--- a/apps/trading/pages/styles.css
+++ b/apps/trading/pages/styles.css
@@ -34,6 +34,18 @@ html [data-theme='dark'] {
   /* sell candles only use stroke as the candle is solid (without border) */
   --pennant-color-sell-stroke: theme('colors.vega.pink.500');
 
+  /* studies */
+  --pennant-color-eldar-ray-bear-power: theme('colors.vega.pink.500');
+  --pennant-color-eldar-ray-bull-power: theme('colors.vega.green.650');
+
+  --pennant-color-macd-divergence-buy: theme('colors.vega.green.650');
+  --pennant-color-macd-divergence-sell: theme('colors.vega.pink.500');
+  --pennant-color-macd-signal: theme('colors.vega.blue.500');
+  --pennant-color-macd-macd: theme('colors.vega.yellow.500');
+
+  --pennant-color-volume-buy: theme('colors.vega.green.650');
+  --pennant-color-volume-sell: theme('colors.vega.pink.500');
+
   /* depth chart */
   --pennant-color-depth-buy-fill: theme('colors.vega.green.650');
   --pennant-color-depth-buy-stroke: theme('colors.vega.green.500');
@@ -50,6 +62,9 @@ html [data-theme='light'] {
   /* sell candles only use stroke as the candle is solid (without border) */
   --pennant-color-sell-stroke: theme('colors.vega.pink.400');
 
+  --pennant-color-volume-buy: theme('colors.vega.green.400');
+  --pennant-color-volume-sell: theme('colors.vega.pink.500');
+
   /* depth chart */
   --pennant-color-depth-buy-fill: theme('colors.vega.green.400');
   --pennant-color-depth-buy-stroke: theme('colors.vega.green.550');
diff --git a/libs/candles-chart/src/lib/candles-chart.tsx b/libs/candles-chart/src/lib/candles-chart.tsx
index 8a65b39b2..3e426f7d7 100644
--- a/libs/candles-chart/src/lib/candles-chart.tsx
+++ b/libs/candles-chart/src/lib/candles-chart.tsx
@@ -1,6 +1,6 @@
 import 'pennant/dist/style.css';
 import {
-  Chart,
+  CandlestickChart,
   ChartType,
   Interval,
   Overlay,
@@ -234,7 +234,7 @@ export const CandlesChartContainer = ({
         </DropdownMenu>
       </div>
       <div className="flex-1">
-        <Chart
+        <CandlestickChart
           dataSource={dataSource}
           options={{
             chartType: chartType,
diff --git a/package.json b/package.json
index 39212a980..5c79d4e27 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
     "@web3-react/walletconnect": "^8.0.23-beta.0",
     "ag-grid-community": "^27.0.1",
     "ag-grid-react": "^27.0.1",
-    "allotment": "^1.17.1",
+    "allotment": "1.18.1",
     "alpha-lyrae": "vegaprotocol/alpha-lyrae",
     "apollo": "^2.33.9",
     "apollo-link-timeout": "^4.0.0",
@@ -63,7 +63,7 @@
     "js-sha3": "^0.8.0",
     "lodash": "^4.17.21",
     "next": "12.2.3",
-    "pennant": "1.6.0",
+    "pennant": "1.8.1",
     "react": "18.2.0",
     "react-copy-to-clipboard": "^5.0.4",
     "react-dom": "18.2.0",
diff --git a/yarn.lock b/yarn.lock
index ed9ceef55..87cfa463d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8153,13 +8153,13 @@ ajv@^8.0.0, ajv@^8.0.1, ajv@^8.8.0:
     require-from-string "^2.0.2"
     uri-js "^4.2.2"
 
-allotment@1.17.1, allotment@^1.17.1:
-  version "1.17.1"
-  resolved "https://registry.yarnpkg.com/allotment/-/allotment-1.17.1.tgz#1a87fe911e520e6028df3740d9ba397c48f8e8d7"
-  integrity sha512-3/blHxKZfP441IZRwoOJaaNfDOx9XtvQQaeRYYrn7xjQWF7ZhYZCfR7oNxudwx2ga21tIskvfytbZF2P/ydE3A==
+allotment@1.18.1:
+  version "1.18.1"
+  resolved "https://registry.yarnpkg.com/allotment/-/allotment-1.18.1.tgz#a31b0cb5b301309334dfa352c7704361437058de"
+  integrity sha512-ZhmpHoSvxHyPT5XjzTHeCBjzCMIFn1aGdNAzBCZhj1CcRMp31CaJCi+lfweoOLDbbjJqbFZqUk3xf+p7Mb0x5A==
   dependencies:
     classnames "^2.3.0"
-    eventemitter3 "^4.0.0"
+    eventemitter3 "^5.0.0"
     lodash.clamp "^4.0.0"
     lodash.debounce "^4.0.0"
     lodash.isequal "^4.5.0"
@@ -9962,6 +9962,11 @@ chownr@^2.0.0:
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-2.0.0.tgz#15bfbe53d2eab4cf70f18a8cd68ebe5b3cb1dece"
   integrity sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==
 
+chroma-js@^2.4.2:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/chroma-js/-/chroma-js-2.4.2.tgz#dffc214ed0c11fa8eefca2c36651d8e57cbfb2b0"
+  integrity sha512-U9eDw6+wt7V8z5NncY2jJfZa+hUH8XEj8FQHgFJTrUFnJfXYf4Ml4adI2vXZOjqRDpFWtYVWypDfZwnJ+HIR4A==
+
 chrome-trace-event@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz#1015eced4741e15d06664a957dbbf50d041e26ac"
@@ -18460,10 +18465,10 @@ pend@~1.2.0:
   resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
   integrity sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==
 
-pennant@1.6.0:
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/pennant/-/pennant-1.6.0.tgz#9c7d873527defba689439a18f2ff2f9aa5ababea"
-  integrity sha512-0eWZmFNaWMCYHj9C/+KgwFy8sf/dEkR2TilYrkoRgOVgziDFakojHSiNIwFrqYZFXH1HincYwS7PjKFtQkvrRA==
+pennant@1.8.1:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/pennant/-/pennant-1.8.1.tgz#bb5f8fd2ae78e0e53ff43bea565765bf7e47b255"
+  integrity sha512-kUKRLfM8GdE+RSlS45Rz/QMQ6xorbzAqw/ybOVR/2gVO6L3sY16+vrgVSJd89RbR+sI/foWe5buXwFmjwFR7Kg==
   dependencies:
     "@babel/runtime" "^7.13.10"
     "@d3fc/d3fc-technical-indicator" "^8.0.1"
@@ -18484,7 +18489,8 @@ pennant@1.6.0:
     "@types/react" "^18.0.14"
     "@types/react-dom" "^18.0.5"
     "@types/react-virtualized-auto-sizer" "^1.0.0"
-    allotment "1.17.1"
+    allotment "1.18.1"
+    chroma-js "^2.4.2"
     classnames "^2.2.6"
     d3-array "2.8.0"
     d3-axis "^3.0.0"
@@ -18505,7 +18511,6 @@ pennant@1.6.0:
     lodash "^4.17.20"
     react-virtualized-auto-sizer "^1.0.4"
     sass "^1.49.9"
-    typescript "^4.1.2"
     use-resize-observer "^9.0.0"
 
 performance-now@^2.1.0:
@@ -22304,11 +22309,6 @@ typescript@4.7.4:
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.4.tgz#1a88596d1cf47d59507a1bcdfb5b9dfe4d488235"
   integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==
 
-typescript@^4.1.2:
-  version "4.9.4"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.9.4.tgz#a2a3d2756c079abda241d75f149df9d561091e78"
-  integrity sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg==
-
 typescript@^4.4.3:
   version "4.8.4"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.8.4.tgz#c464abca159669597be5f96b8943500b238e60e6"