> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.knapsack.cloud/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.knapsack.cloud/_mcp/server.

# Figma Tiles Block

## Figma Tiles

The Figma Tiles Block enables you to showcase specific items from your design source. This block allows you to highlight individual elements, such as individual components, variants, and frames, making it easy to reference and utilize specific design assets within your documentation.

![Design source tile selection](https://fdr-prod-docs-files-public.s3.us-east-1.amazonaws.com/knapsack-docs.docs.buildwithfern.com/060a5908eb3f6042b203b2d3daec06105092a51f844b3bc2f4b5a9f56fabbeeb/docs/assets/images/68271ab3-figma-ptgnwmz1kpng.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA6KXJSKKNFOCF7G4B%2F20260724%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20260724T211300Z&X-Amz-Expires=604800&X-Amz-Signature=7096d542825a758a263ed2aac226e8472145cb08fe8d45d415e27f073157f6b2&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject)

We can select individual variants or components from our Figma file to display in a group. This enables users to mix and match component types to add to the documentation.

![figma.png](https://fdr-prod-docs-files-public.s3.us-east-1.amazonaws.com/knapsack-docs.docs.buildwithfern.com/a30e3111a2e60d8c0411fdf3a87c7c7bd28e533e82999fb87d540bb3f09b67b7/docs/assets/images/1cd8e4d5-figma-w7mwqxhm0mpng.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA6KXJSKKNFOCF7G4B%2F20260724%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20260724T211300Z&X-Amz-Expires=604800&X-Amz-Signature=34fd14d0bb2d59d5aa13ee190caaba129fd42f60f5a53da688315ce52b951623&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject)