---
title: "SymbolPaintProps | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Type Alias SymbolPaintProps

type SymbolPaintProps \= {  
    ["icon-color"](#icon-color): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>;  
    ["icon-halo-blur"](#icon-halo-blur): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["icon-halo-color"](#icon-halo-color): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>;  
    ["icon-halo-width"](#icon-halo-width): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["icon-opacity"](#icon-opacity): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["icon-translate"](#icon-translate): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<\[number, number\]\>;  
    ["icon-translate-anchor"](#icon-translate-anchor): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>;  
    ["text-color"](#text-color): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>;  
    ["text-halo-blur"](#text-halo-blur): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["text-halo-color"](#text-halo-color): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>;  
    ["text-halo-width"](#text-halo-width): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["text-opacity"](#text-opacity): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["text-translate"](#text-translate): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<\[number, number\]\>;  
    ["text-translate-anchor"](#text-translate-anchor): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>;  
}

##### Index

### Properties[](#properties)

[icon-color](#icon-color) [icon-halo-blur](#icon-halo-blur) [icon-halo-color](#icon-halo-color) [icon-halo-width](#icon-halo-width) [icon-opacity](#icon-opacity) [icon-translate](#icon-translate) [icon-translate-anchor](#icon-translate-anchor) [text-color](#text-color) [text-halo-blur](#text-halo-blur) [text-halo-color](#text-halo-color) [text-halo-width](#text-halo-width) [text-opacity](#text-opacity) [text-translate](#text-translate) [text-translate-anchor](#text-translate-anchor)

## Properties[](#properties-1)

### icon-color[](#icon-color)

"icon-color": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>

### icon-halo-blur[](#icon-halo-blur)

"icon-halo-blur": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### icon-halo-color[](#icon-halo-color)

"icon-halo-color": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>

### icon-halo-width[](#icon-halo-width)

"icon-halo-width": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### icon-opacity[](#icon-opacity)

"icon-opacity": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### icon-translate[](#icon-translate)

"icon-translate": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<\[number, number\]\>

### icon-translate-anchor[](#icon-translate-anchor)

"icon-translate-anchor": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>

### text-color[](#text-color)

"text-color": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>

### text-halo-blur[](#text-halo-blur)

"text-halo-blur": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### text-halo-color[](#text-halo-color)

"text-halo-color": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>

### text-halo-width[](#text-halo-width)

"text-halo-width": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### text-opacity[](#text-opacity)

"text-opacity": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### text-translate[](#text-translate)

"text-translate": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<\[number, number\]\>

### text-translate-anchor[](#text-translate-anchor)

"text-translate-anchor": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>