diff --git a/docs/angular/src/content/en/components/chip.mdx b/docs/angular/src/content/en/components/chip.mdx
index cd708630de..ec31a542f6 100644
--- a/docs/angular/src/content/en/components/chip.mdx
+++ b/docs/angular/src/content/en/components/chip.mdx
@@ -98,6 +98,15 @@ The <ApiLink type="Chip" /> has an <ApiLink type="Chip" member="id" label="id" /
 </igx-chip>
 ```
 
+## Variants
+
+The Angular chip supports several pre-defined stylistic variants. You can change the variant by assigning one of the supported values - `primary`, `info`, `success`, `warning`, or `danger` to the <ApiLink type="Chip" member="variant" label="variant" /> input property.
+
+```html
+<igx-chip variant="success">Success</igx-chip>
+```
+
+<Sample src="/data-display/chip-variants" height={100} alt="Angular Chip Variants Example" />
 
 ### Selection
 
diff --git a/docs/angular/src/content/jp/components/chip.mdx b/docs/angular/src/content/jp/components/chip.mdx
index f1dcbdf01f..c7e0505ef7 100644
--- a/docs/angular/src/content/jp/components/chip.mdx
+++ b/docs/angular/src/content/jp/components/chip.mdx
@@ -99,6 +99,16 @@ Ignite UI for Angular Chips モジュールまたはディレクティブをイ
 </igx-chip>
 ```
 
+## バリアント
+
+Angular チップは、いくつかの定義済みスタイル バリアントをサポートしています。<ApiLink type="Chip" member="variant" label="variant" /> 入力プロパティにサポートされている値のいずれか (`primary`、`info`、`success`、`warning`、または `danger`) を割り当てることで、バリアントを変更できます。
+
+```html
+<igx-chip variant="success">Success</igx-chip>
+```
+
+<Sample src="/data-display/chip-variants" height={100} alt="Angular Chip バリアントの例" />
+
 ### 選択
 
 <Image src={selectingDefault} alt="Selecting Default" class="responsive-img" />