> For the complete documentation index, see [llms.txt](https://developers.felt.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers.felt.com/felt-style-language/getting-started.md). # Getting started The Felt Style Language (FSL) is a JSON-based specification for styling data layers in Felt — comparable to the Mapbox Style Spec, but at the layer level. A single JSON object describes how a layer is drawn (`paint`), labeled (`label`), classified (`config`), and presented in popups and legends. ## Where you use FSL The same style object works in three places: * **In the Felt app** — open a layer's overflow menu and choose `Actions > Edit style language` to view and edit the layer's FSL directly. (The neighbouring `Actions > Edit styles` opens the visual style editor, which has no JSON view.) * **Via the REST API** — read a layer's `style` field and update it with [`POST /update_style`](/rest-api/styling-layers.md). * **Via the JS SDK** — apply session-only style changes with [`setLayerStyle`](https://developers.felt.com/js-sdk-api-reference/layers/layerscontroller#setlayerstyle). ## Your first style Every style needs a `version` and a `type`. Here is a complete, minimal style that draws a point layer in green with a visible stroke: ```json { "version": "2.3.1", "type": "simple", "config": {}, "paint": { "color": "#28A745", "size": 8, "strokeColor": "auto", "strokeWidth": 1 }, "legend": {}, "label": {}, "popup": {} } ``` Paste this into `Actions > Edit style language` on any point layer and the points turn green immediately. From here, styling is incremental: change `"type"` to `"categorical"` or `"numeric"` to drive color or size from your data, add `steps` or `categories` to `config`, and swap literal colors for [`@palette` shortcuts](/felt-style-language/colors-and-palettes.md). ## Anatomy of a style | Key | Purpose | | ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `version` | The FSL version the style is written against. Use `"2.3.1"` (current). Older versions are accepted and migrated automatically. | | `type` | The visualization type: `simple`, `categorical`, `numeric`, `heatmap`, `h3`, or `hillshade`. See [Types of visualizations](/felt-style-language/types-of-visualizations.md). | | `config` | Data configuration: which attribute drives the visualization, class breaks, categories, aggregation. See [The config block](/felt-style-language/style-definition-blocks/the-config-block.md). | | `paint` | How geometries and pixels are drawn: colors, sizes, strokes, opacity, icons. See [The paint block](/felt-style-language/style-definition-blocks/the-paint-block.md). | | `label` | Feature labels: fonts, halos, placement, zoom range. See [The label block](/felt-style-language/style-definition-blocks/the-label-block.md). | | `popup` | What clicking a feature shows. See [The popup block](/felt-style-language/style-definition-blocks/the-popup-block.md). | | `attributes` | Display names and number formatting for attributes. See [The attributes block](/felt-style-language/style-definition-blocks/the-attributes-block.md). | | `filters` | Which features are visible. See [The filters block](/felt-style-language/style-definition-blocks/the-filters-block.md). | | `legend` | Legend labels. See [Legends](/felt-style-language/legends.md). | ## Explore the language ### Style definition blocks Learn how to define and configure the code blocks that compose the Felt Style Language {% content-ref url="/pages/ia98n0VZ2bW0rDUZjF49" %} [Style definition blocks](/felt-style-language/style-definition-blocks.md) {% endcontent-ref %} ### Types of visualizations Learn about visualization types, including simple, categorical, numeric (color by & size by), heatmaps, H3, and raster (imagery, numeric, categorical, and hillshade). {% content-ref url="/pages/t1uG4exfWZRod1VeBRFi" %} [Types of visualizations](/felt-style-language/types-of-visualizations.md) {% endcontent-ref %} ### Colors, icons & classification Shared building blocks referenced throughout the language: smart `"auto"` colors and named palettes, the icon catalog, and the classification methods used to turn numbers into classes. {% content-ref url="/pages/T2CzLFRxCIMHaz4WjYm8" %} [Colors & palettes](/felt-style-language/colors-and-palettes.md) {% endcontent-ref %} {% content-ref url="/pages/x4VFtWKNEKYOiqWp7dAQ" %} [Icons](/felt-style-language/icons.md) {% endcontent-ref %} {% content-ref url="/pages/fdqlMScWxZO7qFHImPxT" %} [Classification methods](/felt-style-language/classification-methods.md) {% endcontent-ref %} ### Zoom-based styling Vary paint and label properties with the map's zoom level using interpolators. {% content-ref url="/pages/wSQReOdXoeF1OhZv1hts" %} [Zoom-based styling](/felt-style-language/zoom-based-styling.md) {% endcontent-ref %} ### Legends Details on how to customize legends on a per-layer basis. {% content-ref url="/pages/1fKJtssIMYNDGoHaGUKl" %} [Legends](/felt-style-language/legends.md) {% endcontent-ref %} ### Errors Definitions for errors raised when validating the Felt Style Language. {% content-ref url="/pages/X4xQjPoTGzipaOEgV5zN" %} [Errors](/felt-style-language/errors.md) {% endcontent-ref %} ### Examples A compact gallery with one worked example per visualization type. {% content-ref url="/pages/BXFcwzVszq56jUVsZcNT" %} [Examples](/felt-style-language/examples.md) {% endcontent-ref %} --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://developers.felt.com/felt-style-language/getting-started.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.