Appearance

Personalize your experience

Mode
Accent Color
Direction
Smoothed Heikin-Ashi

Smoothed Heikin-Ashi

Charts / Chart Types / Candle Charts

Heikin-Ashi calculated on averaged prices and averaged again, for trend-following with very few false colour changes.

What the chart shows

Standard candles average each bar with the previous one, which removes much of the noise of raw candles. In a choppy market they still change colour often. Smoothed Heikin-Ashi adds two moving averages: one on the raw prices before the transform, and one on the Heikin-Ashi prices after it. The candles then stay one colour for the whole of a trend and change colour only when the trend .

The price of this smoothness is lag and a loss of the real prices. The candles show where the averaged market is, not where it traded, so they are used to judge the trend while entries and stops use real prices.

Menu
Chart type → Candles → Smoothed Heikin Ashi
Engine type
smoothed-heikin-ashi
Data
Candles (OHLC). Volume is passed through unchanged.
Renderer
Canvas 2D on the normal time ; a recomputes only the forming bar
Good for
Trend direction, trailing exits, filtering entries from other signals

Anatomy of the chart

Anatomy of smoothed Heikin-Ashitrend change markerraw candles (faded)smoothed up candlesmoothed down candleChoppy top: raw candles flip colour often, smoothed candles change once.
Smoothed candles over faded raw candles. Triangles mark colour changes.
PartWhat it isHow to read it
Smoothed candleOpen, high, low and close after the three-stage calculation.Colour shows the trend. Body size shows its strength: bodies as a trend slows.
Smoothed high and low.A trend candle without a on its back side (no lower wick on green) shows a strong trend.
Trend change marker where the colour changes: below the low for a change to up, above the high for a change to down.Marks the bar where the smoothed trend turned. Hidden when bars are narrower than 3 px.
Raw candles (optional)The real candles, faded, behind the smoothed series.Shows where price actually traded, which is what and stops need.

How the candles are calculated, step by step

The three-stage calculationRaw OHLCO, H, L, C1. Before HAMA of O,H,L,C2. Heikin-Ashitransform3. After HAMA of HA O,H,L,C→→→Heikin-Ashi on the averaged bar:HA close = (O + H + L + C) / 4HA open = (previous HA open + previous HA close) / 2HA high = max(H, HA open, HA close)HA low = min(L, HA open, HA close)Each MA can be EMA, SMA, WMA or RMA with its own length.
Moving average, then Heikin-Ashi, then a second moving average.
  1. 1
    Average the raw prices
    Open, high, low and close are each averaged with the Before HA and length. 10 is the default.
  2. 2
    Apply Heikin-Ashi to the averaged bar
    = (O + H + L + C) / 4. HA open = (previous HA open + previous HA close) / 2; the first bar uses (O + C) / 2. HA high and low extend to include the HA open and close.
  3. 3
    Average the Heikin-Ashi prices
    , high, low and close are each averaged with the After HA and length.
  4. 4
    Form the candle
    The second averages give open and close. High and low are widened if needed so they always contain the body.
  5. 5
    Colour
    Close above or equal to open is up; below is down. A marker is drawn where the colour differs from the previous bar.
AverageBehaviour
Weights recent bars more. Reacts fastest for a given length. Default.
SMAEqual weights. , but reacts when old bars leave the .
WMALinearly decreasing weights. Between and SMA.
RMA ()Like an with a longer memory (α = 1 / length). The smoothest of the four for a given length.

Compared with raw and standard Heikin-Ashi

Raw vs Heikin-Ashi vs smoothedRaw candles15 colour changesHeikin-Ashi8 colour changesSmoothed HA 10/102 colour changes
The same 40 bars three ways. The number of colour changes is counted from the data.
Smoothing vs lag2 / 25 / 510 / 1020 / 20raw closeLonger lengths turn later at the top and bottom of a swing.
Mid-body of the smoothed candles for four length pairs against the raw close. More smoothing means a later turn.

Reading the chart, step by step

  1. 1
    Read the colour as the trend
    Green: trade long or stay flat. Red: trade short or stay flat. Many traders only take signals from other tools in the direction of the colour.
  2. 2
    Watch body size
    Bodies shrinking for several bars mean the trend is losing momentum, often before the colour changes.
  3. 3
    Check the back-side wick
    Green candles with lower wicks, or red with upper wicks, show that the opposite side is pushing back.
  4. 4
    Act on confirmed changes
    A colour change on the forming bar can still reverse. Wait for the bar to close.
  5. 5
    Use real prices for orders
    Turn on raw candles to place stops and targets at real ; the smoothed values may never have traded.

Setting it up, step by step

  1. 1
    Select the chart type
    Chart type menu → Candles → Smoothed Heikin Ashi.
  2. 2
    Open the settings
    Click the gear to the left of the name.
  3. 3
    Choose the smoothing
    Start with 10 / EMA 10. For faster use 5 / 5; for swing trading on daily bars try 20 / 20.
  4. 4
    Turn on the raw candles
    Enable Raw candles behind with an around 0.25, so you always see real prices.
  5. 5
    Keep the markers
    Trend change markers make the easy to spot when scrolling back.

Common setups

Intraday trend filter

5-minute bars, 5 / EMA 5, raw candles on. Take only entries in the candle colour.

Swing trend

Daily bars, 10 / EMA 10. Exit when the colour changes on a closed bar.

Very smooth

RMA 14 / RMA 14 on hourly bars for a slow regime .

Limitations

!
Caution:Smoothed open, high, low and close are not traded prices. Do not use them for order prices or for backtests that assume at the candle values.
  • Every turn comes late. The longer the averages, the more of the move is given back before the colour changes.
  • In sideways markets with wide swings the chart can stay one colour while price moves several percent against it.
  • averages (, RMA) depend on the first loaded bar; values settle after a few times the length.

Native Quatick implementation and live demos

The charts below are the real Quatick engine (@quatick/quatick-charts), the same code the trading terminal runs, fed by a deterministic simulated market. Switch between demos, press Run market to stream ticks, to pan and use the wheel to zoom. Show code exactly the calls each makes.

Live demo
Default smoothing with raw candles behind.
Loading the Quatick chart engine…
smoothed-heikin-ashi · 0 bars · last — · drag to pan, wheel to zoom

How the engine draws Smoothed Heikin-Ashi

Smoothed Heikin-Ashi: native Quatick pipelineDATA INENGINE COMPUTESRENDERERDRAWN ON TOPOHLCV barsLive tick →chart.update()1. MA of O, H, L, C2. Heikin-Ashi transform3. MA of HA O, H, L, C4. Trend-change detectionCanvas 2D(candlestickrenderer)Raw candles(optional)Trend markersCrosshairLive update cost: O(1) per tick: recursive MAs resume from the last bar
Inputs, computation, renderer and overlay layers of the Smoothed Heikin-Ashi chart type in the native engine.
StageWhat happens
in bars
→ chart.update()
MA of O, H, L, C
transform
MA of HA O, H, L, C
Step 4Trend-change detection
Canvas 2D ( )
LayersRaw candles (optional) · Trend markers ·
updatesO(1) per : MAs from the last bar

How data reaches the screen

How data reaches the screenYour app / broker feedChart APIEngine stores & cachesScreen (rAF)new Chart({ container, chartType })setData(series, bars)bars → data managerindex + boundssetChartTypeOptions(type, {...})sanitise against schemaclamp rangesupdate(series, formingBar) — every tickrecompute forming barO(1)request redrawone framerender price action + overlays
The calls your code makes, what the engine stores, and when it draws. Redraws are coalesced into one animation frame.

Minimal implementation

The first above, as standalone code:

typescript
import { Chart } from '@quatick/quatick-charts';

const chart = new Chart({
  container: document.getElementById('chart')!,
  chartType: 'smoothed-heikin-ashi',
  theme: 'dark',
  renderer: 'canvas',
  showVolume: true,
});
const series = chart.addSeries({ type: 'candlestick' });
chart.setData(series.id, bars); // [{ time, open, high, low, close, volume }] — time in seconds

chart.setChartTypeOptions('smoothed-heikin-ashi', {
  showRawCandles: true,
  rawOpacity: 0.25
});

// Live: every tick updates the forming bar (a new time opens a new bar)
feed.onTick(bar => chart.update(series.id, bar));

Quatick settings reference

Loading the settings list…

See also

Related articles

  • Heikin-Ashi

    Charts / Chart Types / Candle Charts

    A Japanese smoothing technique that modifies standard candlesticks using a running average formula to filter market noise and reveal clearer trend…

  • Hollow Candle

    Charts / Chart Types / Candle Charts

    A modern variant of the candlestick chart that modifies the body fill rule: a candle is hollow when the close exceeds the prior close, regardless of the…

  • Candlestick

    Charts / Chart Types / Candle Charts

    The most widely used chart type in financial markets, candlestick charts encode four-dimensional OHLC data into a visually rich body-and-wick format that…

  • Volume Candle

    Charts / Chart Types / Candle Charts

    A hybrid chart type that scales the width of each candle body proportionally to the period’s trading volume, combining price action and participation in a…

  • Line Break

    Charts / Chart Types / Special Charts

    A time-independent charting method originating from Japan that constructs a series of vertical blocks based on price movement relative to previous blocks.

  • Absorption & Iceberg Map

    Charts / Chart Types / Volume Charts

    Hidden liquidity made visible: levels where more traded than the book showed, and levels that absorbed heavy flow without breaking.

  • Area Chart

    Charts / Chart Types / Area Charts

    An extension of the line chart that fills the region between the price line and a baseline with a gradient or solid color, providing visual weight to price…

  • Baseline

    Charts / Chart Types / Area Charts

    A variant of the area chart that uses dual-colored fills — green above the baseline, red below — providing an immediate visual assessment of relative…

  • Chart Types Overview

    Charts / Chart Types

    A comprehensive reference to every chart type available in Quatick Charts — from the foundational candlestick to advanced orderflow and speciality…

Browse all knowledge base articles →