This sample shows how to add a VectorTileLayer from a JSON style object by setting the layer's style property. Esri's mid-century vector tiles style is simplified and the VectorTileLayer is added from the modified JSON object. In addition to the above-mentioned, Esri offers a set of vector basemaps with different styles.
The ArcGIS Vector Tile Style Editor is used to design custom vector basemaps and it takes advantage of methods mentioned above.
// change the font case for the countries(Admin0 point/large) labels layerdocument.getElementById("layoutButton").addEventListener("click", function(){
// get the layout properties for the Admin0 point/large layerconst layoutProperties = vtLayer.getLayoutProperties("Admin0 point/large");
// change the text-transform layout property layoutProperties["text-transform"] = layoutProperties["text-transform"] == "uppercase" ? "none" : "uppercase";
vtLayer.setLayoutProperties("Admin0 point/large", layoutProperties);
// change the fill-color for the water(Marine area/1) layerdocument.getElementById("paintButton").addEventListener("click", function(){
// get the paint properties for the marine area/1 layerconst paintProperties = vtLayer.getPaintProperties("Marine area/1");
// change the fill-color paint property for the layer. paintProperties["fill-color"] = paintProperties["fill-color"] == "#93CFC7" ? "#0759C1" : "#93CFC7";
vtLayer.setPaintProperties("Marine area/1", paintProperties);
});