--- title: Can I Use createTime: 2025/10/08 14:50:55 icon: streamline:desktop-help permalink: /en/guide/markdown/caniuse/ badge: New --- ## Overview When writing articles, this feature provides the functionality to embed platform support information for WEB features from [can-i-use](https://caniuse.com/). This allows for a more intuitive representation of a feature's support level when describing a specific WEB feature. ## Configuration This feature is disabled by default. You can enable it in the configuration file. ```ts title=".vuepress/config.ts" export default defineUserConfig({ theme: plumeTheme({ markdownP: { caniuse: true, // [!code ++] }, }) }) ``` In your article's markdown file, use the following format: ``` md @[caniuse](feature) ``` For ease of use, the theme provides tool support: [caniuse Feature Search](../../../tools/caniuse.md). You can use this tool directly to help generate the markdown code. ## Syntax ``` md @[caniuse](feature) @[caniuse{browser_versions}](feature) @[caniuse embed_type](feature) @[caniuse embed_type{browser_versions}](feature) ``` :::info Using the caniuse tool provided by the theme: [caniuse feature search](../../../../tools/caniuse.md) to help generate markdown code. ::: - `feature` Required. For correct values, please refer to [caniuse-embed.vercel.app](https://caniuse-embed.vercel.app/zh-CN). - `{browser_period}` Optional. The support status of the current feature across multiple version cycles. Default value: `{-2,1}` Format: `{past,future}` with a value range of `-5 ~ 3` - Values less than `0` indicate support status in past browser version cycles. - `0` indicates support status in the current browser version. - Values greater than `0` indicate support status in future browser version cycles. - `embed_type` Optional. The type of resource embedding. Type: `'embed' | 'baseline'` Default value: `'embed'` - `embed` means embedding as version compatibility data tables similar to `caniuse.com` - `baseline` means embedding as the baseline support status of a feature. - `Wildly available` indicates broad support across all major browsers - `Newly available` indicates support only in the latest major browsers - `limit available` indicates that major browsers may offer partial support, but it is limited, or not supported - `deprecated` indicates that major browsers have marked it as **deprecated** and do not recommend its use ## Examples **Get the browser support for the CSS pseudo-class selector `:dir()`:** ```md @[caniuse](css-matches-pseudo) ``` Result: @[caniuse](css-matches-pseudo) **Display baseline support for the CSS pseudo-class selector `:dir()`:** ```md @[caniuse baseline](css-matches-pseudo) ``` Result: @[caniuse baseline](css-matches-pseudo)