diff --git a/src/chart/candlestick/CandlestickSeries.ts b/src/chart/candlestick/CandlestickSeries.ts
index 6f104e5bfb..019e1c55f4 100644
--- a/src/chart/candlestick/CandlestickSeries.ts
+++ b/src/chart/candlestick/CandlestickSeries.ts
@@ -43,6 +43,7 @@ type CandlestickDataValue = OptionDataValue[];
 interface CandlestickItemStyleOption extends ItemStyleOption {
     color0?: ZRColor
     borderColor0?: ColorString
+    borderColorDoji?: ZRColor
 }
 export interface CandlestickStateOption {
     itemStyle?: CandlestickItemStyleOption
@@ -116,6 +117,7 @@ class CandlestickSeriesModel extends SeriesModel<CandlestickSeriesOption> {
             color0: '#47b262', // negative
             borderColor: '#eb5454',
             borderColor0: '#47b262',
+            borderColorDoji: null, // when close === open
             // borderColor: '#d24040',
             // borderColor0: '#398f4f',
             borderWidth: 1
diff --git a/src/chart/candlestick/CandlestickView.ts b/src/chart/candlestick/CandlestickView.ts
index ed4f6660c6..3d05e81c70 100644
--- a/src/chart/candlestick/CandlestickView.ts
+++ b/src/chart/candlestick/CandlestickView.ts
@@ -368,9 +368,16 @@ function createLarge(
         ignoreCoarsePointer: true
     });
     group.add(elN);
+    const elDoji = new LargeBoxPath({
+        shape: {points: largePoints},
+        __sign: 0,
+        ignoreCoarsePointer: true
+    });
+    group.add(elDoji);
 
     setLargeStyle(1, elP, seriesModel, data);
     setLargeStyle(-1, elN, seriesModel, data);
+    setLargeStyle(0, elDoji, seriesModel, data);
 
     if (incremental) {
         elP.incremental = true;
@@ -384,8 +391,12 @@ function createLarge(
 
 function setLargeStyle(sign: number, el: LargeBoxPath, seriesModel: CandlestickSeriesModel, data: SeriesData) {
     // TODO put in visual?
-    const borderColor = seriesModel.get(['itemStyle', sign > 0 ? 'borderColor' : 'borderColor0'])
+    let borderColor = seriesModel.get(['itemStyle', sign > 0 ? 'borderColor' : 'borderColor0'])
+        // Use color for border color by default.
         || seriesModel.get(['itemStyle', sign > 0 ? 'color' : 'color0']);
+    if (sign === 0) {
+        borderColor = seriesModel.get(['itemStyle', 'borderColorDoji']);
+    }
 
     // Color must be excluded.
     // Because symbol provide setColor individually to set fill and stroke
diff --git a/src/chart/candlestick/candlestickLayout.ts b/src/chart/candlestick/candlestickLayout.ts
index 2a9afd9975..f655b381f0 100644
--- a/src/chart/candlestick/candlestickLayout.ts
+++ b/src/chart/candlestick/candlestickLayout.ts
@@ -22,7 +22,7 @@ import createRenderPlanner from '../helper/createRenderPlanner';
 import {parsePercent} from '../../util/number';
 import {map, retrieve2} from 'zrender/src/core/util';
 import { DimensionIndex, StageHandler, StageHandlerProgressParams } from '../../util/types';
-import CandlestickSeriesModel from './CandlestickSeries';
+import CandlestickSeriesModel, { CandlestickDataItemOption } from './CandlestickSeries';
 import SeriesData from '../../data/SeriesData';
 import { RectLike } from 'zrender/src/core/BoundingRect';
 import DataStore from '../../data/DataStore';
@@ -106,8 +106,10 @@ const candlestickLayout: StageHandler = {
                     subPixelOptimizePoint(ocLowPoint)
                 );
 
+                const itemModel = data.getItemModel<CandlestickDataItemOption>(dataIndex);
+                const hasDojiColor = !!itemModel.get(['itemStyle', 'borderColorDoji']);
                 data.setItemLayout(dataIndex, {
-                    sign: getSign(store, dataIndex, openVal, closeVal, closeDimI),
+                    sign: getSign(store, dataIndex, openVal, closeVal, closeDimI, hasDojiColor),
                     initBaseline: openVal > closeVal
                         ? ocHighPoint[vDimIdx] : ocLowPoint[vDimIdx], // open point.
                     ends: ends,
@@ -170,6 +172,7 @@ const candlestickLayout: StageHandler = {
             const tmpOut: number[] = [];
             let dataIndex;
             const store = data.getStore();
+            const hasDojiColor = !!seriesModel.get(['itemStyle', 'borderColorDoji']);
 
             while ((dataIndex = params.next()) != null) {
                 const axisDimVal = store.get(cDimI, dataIndex) as number;
@@ -184,7 +187,7 @@ const candlestickLayout: StageHandler = {
                     continue;
                 }
 
-                points[offset++] = getSign(store, dataIndex, openVal, closeVal, closeDimI);
+                points[offset++] = getSign(store, dataIndex, openVal, closeVal, closeDimI, hasDojiColor);
 
                 tmpIn[cDimIdx] = axisDimVal;
 
@@ -202,10 +205,18 @@ const candlestickLayout: StageHandler = {
     }
 };
 
+/**
+ * Get the sign of a single data.
+ *
+ * @returns 0 for doji with hasDojiColor: true,
+ *          1 for positive,
+ *          -1 for negative.
+ */
 function getSign(
-    store: DataStore, dataIndex: number, openVal: number, closeVal: number, closeDimI: DimensionIndex
-): -1 | 1 {
-    let sign: -1 | 1;
+    store: DataStore, dataIndex: number, openVal: number, closeVal: number, closeDimI: DimensionIndex,
+    hasDojiColor: boolean
+): -1 | 1 | 0 {
+    let sign: -1 | 1 | 0;
     if (openVal > closeVal) {
         sign = -1;
     }
@@ -213,11 +224,15 @@ function getSign(
         sign = 1;
     }
     else {
-        sign = dataIndex > 0
-            // If close === open, compare with close of last record
-            ? (store.get(closeDimI, dataIndex - 1) <= closeVal ? 1 : -1)
-            // No record of previous, set to be positive
-            : 1;
+        sign = hasDojiColor
+            // When doji color is set, use it instead of color/color0.
+            ? 0
+            : (dataIndex > 0
+                // If close === open, compare with close of last record
+                ? (store.get(closeDimI, dataIndex - 1) <= closeVal ? 1 : -1)
+                // No record of previous, set to be positive
+                : 1
+            );
     }
 
     return sign;
diff --git a/src/chart/candlestick/candlestickVisual.ts b/src/chart/candlestick/candlestickVisual.ts
index 963d3dd56e..8882d63333 100644
--- a/src/chart/candlestick/candlestickVisual.ts
+++ b/src/chart/candlestick/candlestickVisual.ts
@@ -25,6 +25,7 @@ import { extend } from 'zrender/src/core/util';
 
 const positiveBorderColorQuery = ['itemStyle', 'borderColor'] as const;
 const negativeBorderColorQuery = ['itemStyle', 'borderColor0'] as const;
+const dojiBorderColorQuery = ['itemStyle', 'borderColorDoji'] as const;
 const positiveColorQuery = ['itemStyle', 'color'] as const;
 const negativeColorQuery = ['itemStyle', 'color0'] as const;
 
@@ -47,7 +48,10 @@ const candlestickVisual: StageHandler = {
 
         function getBorderColor(sign: number, model: Model<Pick<CandlestickDataItemOption, 'itemStyle'>>) {
             return model.get(
-                sign > 0 ? positiveBorderColorQuery : negativeBorderColorQuery
+                sign === 0 ? dojiBorderColorQuery
+                    : sign > 0
+                        ? positiveBorderColorQuery
+                        : negativeBorderColorQuery
             );
         }
 
diff --git a/test/candlestick-doji.html b/test/candlestick-doji.html
index d118c37a3f..05b9d0c425 100644
--- a/test/candlestick-doji.html
+++ b/test/candlestick-doji.html
@@ -1,4 +1,4 @@
-
+<!DOCTYPE html>
 <!--
 Licensed to the Apache Software Foundation (ASF) under one
 or more contributor license agreements.  See the NOTICE file
@@ -18,45 +18,120 @@
 under the License.
 -->
 
+
 <html>
     <head>
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <script src="lib/simpleRequire.js"></script>
         <script src="lib/config.js"></script>
+        <script src="lib/jquery.min.js"></script>
         <script src="lib/facePrint.js"></script>
+        <script src="lib/testHelper.js"></script>
+        <!-- <script src="ut/lib/canteen.js"></script> -->
+        <link rel="stylesheet" href="lib/reset.css" />
     </head>
     <body>
         <style>
-            html, body, #main {
-                width: 100%;
-                height: 100%;
-            }
         </style>
-        <div id="info"></div>
-        <div id="main"></div>
+
+
+
+        <div id="main0"></div>
+        <div id="main1"></div>
+        <div id="main2"></div>
+
+
+
+
+
+
         <script>
+        require([
+            'echarts',
+            // 'map/js/china',
+            // './data/nutrients.json'
+        ], function (echarts) {
+            var option;
+
+            option = {
+                    "xAxis": [{
+                        "type": "category",
+                        "data": ["2017-08-22", "2017-08-23", "2017-08-24", "2017-08-25", "2017-08-28", "2017-08-29", "2017-08-30", "2017-08-31"],
+                        "scale": true,
+                        "boundaryGap": false,
+                        "axisLine": {
+                            "onZero": false,
+                            "lineStyle": {
+                                "color": "#f1f1f1"
+                            }
+                        },
+                        "axisTick": {
+                            "show": false
+                        },
+                        "axisLabel": {
+                            "show": false
+                        },
+                        "axisPointer": {
+                            "z": 100
+                        }
+                    }],
+                    "yAxis": [{
+                    }],
+                    "series": [{
+                        "name": "stock",
+                        "type": "candlestick",
+                        "data": [
+                            [20, 20, 17, 29],
+                            [22.68, 22.68, 22.68, 22.68],
+                            [24.95, 24.95, 20, 28],
+                            [20, 20, 18, 24],
+                            [35, 35, 35, 40],
+                            [36.54, 36.54, 30, 36.54],
+                            [40, 45, 38, 45],
+                            [32, 28, 27, 33]
+                        ],
+                        "itemStyle": {
+                            "color": "#fa6464",
+                            "color0": "#32C896",
+                            "borderColor": "#fa6464",
+                            "borderColor0": "#32C896"
+                        },
+                        "markPoint": {
+                            "label": {
+                                "normal": {}
+                            },
+                            "data": []
+                        }
+                    }]
+                };
 
-            /**
-             * @see <https://en.wikipedia.org/wiki/Michelson%E2%80%93Morley_experiment>
-             * @see <http://bl.ocks.org/mbostock/4061502>
-             */
-            var chart;
-            var data;
+            var chart = testHelper.create(echarts, 'main0', {
+                title: [
+                    'Doji test',
+                    'Expect: red, red, red, green, red, red, red, green'
+                ],
+                option: option
+                // height: 300,
+                // buttons: [{text: 'btn-txt', onclick: function () {}}],
+                // recordCanvas: true,
+            });
+        });
+        </script>
 
-            require([
-                'echarts',
-                'data/security-sh-2013.json.js'
-            ], function (echarts, rawData) {
 
-                chart = echarts.init(document.getElementById('main'), null, {
 
-                });
 
-                option = {
-                    title: {
-                        text: "十字星颜色测试，期望值：红、红、红、绿、红、红、红、绿"
-                    },
+
+        <script>
+        require([
+            'echarts',
+            // 'map/js/china',
+            // './data/nutrients.json'
+        ], function (echarts) {
+            var option;
+
+            option = {
                     "xAxis": [{
                         "type": "category",
                         "data": ["2017-08-22", "2017-08-23", "2017-08-24", "2017-08-25", "2017-08-28", "2017-08-29", "2017-08-30", "2017-08-31"],
@@ -94,13 +169,89 @@
                             [32, 28, 27, 33]
                         ],
                         "itemStyle": {
-                            "normal": {
-                                "color": "#fa6464",
-                                "color0": "#32C896",
-                                "borderColor": "#fa6464",
-                                "borderColor0": "#32C896"
+                            "color": "#fa6464",
+                            "color0": "#32C896",
+                            "borderColorDoji": "#0000ff",
+                            "borderColor": "#fa6464",
+                            "borderColor0": "#32C896"
+                        },
+                        "markPoint": {
+                            "label": {
+                                "normal": {}
+                            },
+                            "data": []
+                        }
+                    }]
+                };
+
+            var chart = testHelper.create(echarts, 'main1', {
+                title: [
+                    'Custom doji color',
+                    'Expect: crosses are all in blue'
+                ],
+                option: option
+                // height: 300,
+                // buttons: [{text: 'btn-txt', onclick: function () {}}],
+                // recordCanvas: true,
+            });
+        });
+        </script>
+
+
+
+        <script>
+        require([
+            'echarts',
+            // 'map/js/china',
+            // './data/nutrients.json'
+        ], function (echarts) {
+            var option;
+
+            option = {
+                    "xAxis": [{
+                        "type": "category",
+                        "data": ["2017-08-22", "2017-08-23", "2017-08-24", "2017-08-25", "2017-08-28", "2017-08-29", "2017-08-30", "2017-08-31"],
+                        "scale": true,
+                        "boundaryGap": false,
+                        "axisLine": {
+                            "onZero": false,
+                            "lineStyle": {
+                                "color": "#f1f1f1"
                             }
                         },
+                        "axisTick": {
+                            "show": false
+                        },
+                        "axisLabel": {
+                            "show": false
+                        },
+                        "axisPointer": {
+                            "z": 100
+                        }
+                    }],
+                    "yAxis": [{
+                    }],
+                    "series": [{
+                        "name": "stock",
+                        "type": "candlestick",
+                        "data": [
+                            [20, 20, 17, 29],
+                            [22.68, 22.68, 22.68, 22.68],
+                            [24.95, 24.95, 20, 28],
+                            [20, 20, 18, 24],
+                            [35, 35, 35, 40],
+                            [36.54, 36.54, 30, 36.54],
+                            [40, 45, 38, 45],
+                            [32, 28, 27, 33]
+                        ],
+                        "itemStyle": {
+                            "color": "#fa6464",
+                            "color0": "#32C896",
+                            "borderColorDoji": "#0000ff",
+                            "borderColor": "#fa6464",
+                            "borderColor0": "#32C896"
+                        },
+                        largeThreshold: 2,
                         "markPoint": {
                             "label": {
                                 "normal": {}
@@ -109,8 +260,20 @@
                         }
                     }]
                 };
-                chart.setOption(option);
+
+            var chart = testHelper.create(echarts, 'main2', {
+                title: [
+                    'Custom doji color with large candlestick',
+                    'Expect: five blue sticks'
+                ],
+                option: option
+                // height: 300,
+                // buttons: [{text: 'btn-txt', onclick: function () {}}],
+                // recordCanvas: true,
             });
+        });
         </script>
+
+
     </body>
-</html>
\ No newline at end of file
+</html>