emoji characters displayed in wrong colour in Text element

import QtQuick 2.0
 
Rectangle {
    width: 360
    height: 360
    Text {
        id: myText
        text:"\uD83D\uDE1C\uD83D\uDE17\uD83D\uDE0A\uD83D\uDE1C\uD83D\uDE1D\uD83D\uDE1D\uD83D\uDE09"
        renderType: Text.NativeRendering
        anchors.centerIn: parent
        onTextChanged: {
            console.log(text);
        }
    }
    MouseArea {
        anchors.fill: parent
        onClicked: {
            myText.text = "\u2601\ud83d\ude32";
        }
    }
}