.x-tag {
    --my-blue: #1677ff;
    --my-purple: #722ED1;
    --my-cyan: #13C2C2;
    --my-green: #52C41A;
    --my-magenta: #EB2F96;
    --my-pink: #eb2f96;
    --my-red: #F5222D;
    --my-orange: #FA8C16;
    --my-yellow: #FADB14;
    --my-volcano: #FA541C;
    --my-geekblue: #2F54EB;
    --my-gold: #FAAD14;
    --my-lime: #A0D911;
    --my-color-primary: #1677ff;
    --my-color-success: #52c41a;
    --my-color-warning: #faad14;
    --my-color-error: #ff4d4f;
    --my-color-info: #1677ff;
    --my-color-link: #1677ff;
    --my-color-text-base: #000;
    --my-color-bg-base: #fff;
    --my-border-radius: 6px;
    --my-blue-1: #e6f4ff;
    --my-blue-2: #bae0ff;
    --my-blue-3: #91caff;
    --my-blue-4: #69b1ff;
    --my-blue-5: #4096ff;
    --my-blue-6: #1677ff;
    --my-blue-7: #0958d9;
    --my-blue-8: #003eb3;
    --my-blue-9: #002c8c;
    --my-blue-10: #001d66;
    --my-purple-1: #f9f0ff;
    --my-purple-2: #efdbff;
    --my-purple-3: #d3adf7;
    --my-purple-4: #b37feb;
    --my-purple-5: #9254de;
    --my-purple-6: #722ed1;
    --my-purple-7: #531dab;
    --my-purple-8: #391085;
    --my-purple-9: #22075e;
    --my-purple-10: #120338;
    --my-cyan-1: #e6fffb;
    --my-cyan-2: #b5f5ec;
    --my-cyan-3: #87e8de;
    --my-cyan-4: #5cdbd3;
    --my-cyan-5: #36cfc9;
    --my-cyan-6: #13c2c2;
    --my-cyan-7: #08979c;
    --my-cyan-8: #006d75;
    --my-cyan-9: #00474f;
    --my-cyan-10: #002329;
    --my-green-1: #f6ffed;
    --my-green-2: #d9f7be;
    --my-green-3: #b7eb8f;
    --my-green-4: #95de64;
    --my-green-5: #73d13d;
    --my-green-6: #52c41a;
    --my-green-7: #389e0d;
    --my-green-8: #237804;
    --my-green-9: #135200;
    --my-green-10: #092b00;
    --my-magenta-1: #fff0f6;
    --my-magenta-2: #ffd6e7;
    --my-magenta-3: #ffadd2;
    --my-magenta-4: #ff85c0;
    --my-magenta-5: #f759ab;
    --my-magenta-6: #eb2f96;
    --my-magenta-7: #c41d7f;
    --my-magenta-8: #9e1068;
    --my-magenta-9: #780650;
    --my-magenta-10: #520339;
    --my-pink-1: #fff0f6;
    --my-pink-2: #ffd6e7;
    --my-pink-3: #ffadd2;
    --my-pink-4: #ff85c0;
    --my-pink-5: #f759ab;
    --my-pink-6: #eb2f96;
    --my-pink-7: #c41d7f;
    --my-pink-8: #9e1068;
    --my-pink-9: #780650;
    --my-pink-10: #520339;
    --my-red-1: #fff1f0;
    --my-red-2: #ffccc7;
    --my-red-3: #ffa39e;
    --my-red-4: #ff7875;
    --my-red-5: #ff4d4f;
    --my-red-6: #f5222d;
    --my-red-7: #cf1322;
    --my-red-8: #a8071a;
    --my-red-9: #820014;
    --my-red-10: #5c0011;
    --my-orange-1: #fff7e6;
    --my-orange-2: #ffe7ba;
    --my-orange-3: #ffd591;
    --my-orange-4: #ffc069;
    --my-orange-5: #ffa940;
    --my-orange-6: #fa8c16;
    --my-orange-7: #d46b08;
    --my-orange-8: #ad4e00;
    --my-orange-9: #873800;
    --my-orange-10: #612500;
    --my-yellow-1: #feffe6;
    --my-yellow-2: #ffffb8;
    --my-yellow-3: #fffb8f;
    --my-yellow-4: #fff566;
    --my-yellow-5: #ffec3d;
    --my-yellow-6: #fadb14;
    --my-yellow-7: #d4b106;
    --my-yellow-8: #ad8b00;
    --my-yellow-9: #876800;
    --my-yellow-10: #614700;
    --my-volcano-1: #fff2e8;
    --my-volcano-2: #ffd8bf;
    --my-volcano-3: #ffbb96;
    --my-volcano-4: #ff9c6e;
    --my-volcano-5: #ff7a45;
    --my-volcano-6: #fa541c;
    --my-volcano-7: #d4380d;
    --my-volcano-8: #ad2102;
    --my-volcano-9: #871400;
    --my-volcano-10: #610b00;
    --my-geekblue-1: #f0f5ff;
    --my-geekblue-2: #d6e4ff;
    --my-geekblue-3: #adc6ff;
    --my-geekblue-4: #85a5ff;
    --my-geekblue-5: #597ef7;
    --my-geekblue-6: #2f54eb;
    --my-geekblue-7: #1d39c4;
    --my-geekblue-8: #10239e;
    --my-geekblue-9: #061178;
    --my-geekblue-10: #030852;
    --my-gold-1: #fffbe6;
    --my-gold-2: #fff1b8;
    --my-gold-3: #ffe58f;
    --my-gold-4: #ffd666;
    --my-gold-5: #ffc53d;
    --my-gold-6: #faad14;
    --my-gold-7: #d48806;
    --my-gold-8: #ad6800;
    --my-gold-9: #874d00;
    --my-gold-10: #613400;
    --my-lime-1: #fcffe6;
    --my-lime-2: #f4ffb8;
    --my-lime-3: #eaff8f;
    --my-lime-4: #d3f261;
    --my-lime-5: #bae637;
    --my-lime-6: #a0d911;
    --my-lime-7: #7cb305;
    --my-lime-8: #5b8c00;
    --my-lime-9: #3f6600;

}
.x-tag {
    --my-bg: var(--my-orange-1);
    --my-border: var(--my-orange-3);
    --my-color: var(--my-orange-7);
}
.x-tag {
    color: var(--my-color);
    background: var(--my-bg);
    border-color: var(--my-border);
    border-style: solid;
    border-width: 1px;
    border-radius: 5px;
    padding: 0.15rem 0.25rem;
}