[Solved]-Style X and Y Axis (tick mark) with Chart.js?-Chart.js

with chart.js v2.1, you can write a plugin to do this

preview

script

chart.pluginservice.register({
    afterdraw: function (chart, easing) {
        if (chart.config.options && chart.config.options.scales) {
            if (chart.config.options.scales.xaxes)
                chart.config.options.scales.xaxes.foreach(function (xaxisconfig) {
                    if (!xaxisconfig.color)
                        return;

                    var ctx = chart.chart.ctx;
                    var chartarea = chart.chartarea;
                    var xaxis = chart.scales[xaxisconfig.id];

                    // just draw the scale again with different colors
                    var color = xaxisconfig.gridlines.color;
                    xaxisconfig.gridlines.color = xaxisconfig.color;
                    xaxis.draw(chartarea);
                    xaxisconfig.gridlines.color = color;
                });

            if (chart.config.options.scales.yaxes)
                chart.config.options.scales.yaxes.foreach(function (yaxisconfig) {
                    if (!yaxisconfig.color)
                        return;

                    var ctx = chart.chart.ctx;
                    var chartarea = chart.chartarea;
                    var yaxis = chart.scales[yaxisconfig.id];

                    // here, since we also have the grid lines, set a clip area for the left of the y axis
                    ctx.save();
                    ctx.rect(0, 0, chartarea.left + yaxisconfig.gridlines.linewidth - 1, chartarea.bottom + yaxisconfig.gridlines.linewidth - 1);
                    ctx.clip();

                    var color = yaxisconfig.gridlines.color;
                    yaxisconfig.gridlines.color = yaxisconfig.color;
                    yaxis.draw(chartarea);
                    yaxisconfig.gridlines.color = color;

                    ctx.restore();
                });

            // we need to draw the tooltip so that it comes over the (redrawn) elements
            chart.tooltip.transition(easing).draw();
        }
    }
});

and then

...
options: {
    scales: {
        xaxes: [{
        color: 'blue',
        ...
        }],
        yaxes: [{
        color: 'blue',
        ...
        }]
    }
...

fiddle - http://jsfiddle.net/zfsc2wuc/