# > The size guide element as a tag: "Size guide" with the TryYourSize mark, then "Your size: M" once the shopper is connected. Source: https://docs.tryyoursize.com/reference/web/tys-size-guide/ *Web component* · `@tryyoursize/sdk/elements` The size guide element as a tag: "Size guide" with the TryYourSize mark, then "Your size: M" once the shopper is connected. ## Attributes - **`publishable-key`** (`string`, required): Your publishable key (`pk_test_…` / `pk_live_…`). - **`product`** (`string`, required): Your product ID or SKU. - **`variant`** (`"link" | "button"`, optional): A text link (default) or an outlined button. - **`label`** (`string`, optional): Your own words for "Size guide" (otherwise localized). - **`locale`** (`string`, optional): BCP 47 language; default: your page's ``, then the browser. ## Example **HTML** ```html

``` ## See also - [Shopify (no code)](https://docs.tryyoursize.com/quickstarts/shopify.md) - [Size guide quickstart](https://docs.tryyoursize.com/quickstarts/size-guide.md)