Auric Artisan ThemeTwenty-four dark and light colour themes built on one OKLCH accent engine, with a Theme Studio for re-keying any of them live and a WCAG and APCA contrast audit. Installation Launch VS Code Quick Open ( Ctrl+P), paste the following command, and press enter.Copied to clipboard |
ऑरिक आर्टिजन थीम
|
| परिवार | कैनवस | विशेषता |
|---|---|---|
| Obsidian | #0C0C0E |
हल्का गर्म चारकोल—वेबसाइट का अपना सरफेस रैम्प। आठ एक्सेंट। |
| Midnight | #050505 |
OLED पैनल और अँधेरे कमरों के लिए लगभग काला। चार एक्सेंट। |
| Parchment | #FFFCF7 |
गर्म क्रीम। गर्म एक्सेंट के लिए उपयुक्त। चार वैरिएंट। |
| Porcelain | #FBFCFD |
ठंडा सफेद। नीला, बैंगनी, टील और स्लेटी रंग क्रीम की अपेक्षा यहाँ बेहतर दिखते हैं। छह वैरिएंट। |
| High contrast | #000000 / #FFFFFF |
hc-black और hc-light; हर कंट्रोल पर सुनहरे बॉर्डर। |
सटीक मानों सहित सभी चौबीस वैरिएंट
| परिवार | एक्सेंट | Id | uiTheme | कैनवस | एक्सेंट |
|---|---|---|---|---|---|
| Obsidian | Gold | obsidian-gold |
vs-dark | #0C0C0E |
#D3AF37 |
| Obsidian | Sapphire | obsidian-sapphire |
vs-dark | #0C0C0E |
#6BA3E8 |
| Obsidian | Rose | obsidian-rose |
vs-dark | #0C0C0E |
#E08AA0 |
| Obsidian | Amethyst | obsidian-amethyst |
vs-dark | #0C0C0E |
#B48AE6 |
| Obsidian | Patina | obsidian-patina |
vs-dark | #0C0C0E |
#5CC9B4 |
| Obsidian | Emerald | obsidian-emerald |
vs-dark | #0C0C0E |
#5CC489 |
| Obsidian | Ember | obsidian-ember |
vs-dark | #0C0C0E |
#E0764A |
| Obsidian | Crimson | obsidian-crimson |
vs-dark | #0C0C0E |
#E06A6A |
| Midnight | Gold | midnight-gold |
vs-dark | #050505 |
#D3AF37 |
| Midnight | Sapphire | midnight-sapphire |
vs-dark | #050505 |
#6BA3E8 |
| Midnight | Rose | midnight-rose |
vs-dark | #050505 |
#E08AA0 |
| Midnight | Iris | midnight-iris |
vs-dark | #050505 |
#8E9BF0 |
| Parchment | Gold | parchment-gold |
vs | #FFFCF7 |
#876C00 |
| Parchment | Rose | parchment-rose |
vs | #FFFCF7 |
#A3536A |
| Parchment | Ember | parchment-ember |
vs | #FFFCF7 |
#B54F20 |
| Parchment | Emerald | parchment-emerald |
vs | #FFFCF7 |
#00804B |
| Porcelain | Sapphire | porcelain-sapphire |
vs | #FBFCFD |
#376DAE |
| Porcelain | Amethyst | porcelain-amethyst |
vs | #FBFCFD |
#8259B0 |
| Porcelain | Patina | porcelain-patina |
vs | #FBFCFD |
#007D6C |
| Porcelain | Rose | porcelain-rose |
vs | #FBFCFD |
#A3536A |
| Porcelain | Iris | porcelain-iris |
vs | #FBFCFD |
#5B65B5 |
| Porcelain | Graphite | porcelain-graphite |
vs | #FBFCFD |
#6B6B6B |
| High contrast | Gold | obsidian-gold-high-contrast |
hc-black | #000000 |
#D3AF37 |
| High contrast | Gold | porcelain-gold-high-contrast |
hc-light | #FFFFFF |
#8C7100 |
लाइट एक्सेंट को तब तक अपने-आप गहरा किया जाता है, जब तक वे साइडबार के सामने
AA कॉन्ट्रास्ट पूरा न कर लें। साइडबार उन दो सतहों में अधिक हल्की है जिन पर एक्सेंट
पढ़ने योग्य होना चाहिए, इसलिए लाइट और डार्क वैरिएंट के मान अलग हैं। Parchment पर
#E08AA0 का कॉन्ट्रास्ट 2.1:1 है; #A3536A उसी Rose का पढ़ने योग्य रूप है।
इसे अपनी पसंद के अनुसार ढालें
Ctrl+Alt+; दबाकर, स्टेटस बार में पेंट-कैन पर क्लिक करके,
या Command Palette में ऑरिक थीम: थीम स्टूडियो खोलें चलाकर Studio खोलें।
यहाँ किए गए किसी भी बदलाव के लिए रीलोड की आवश्यकता नहीं है। हर बदलाव थीम-स्कोप्ड ओवरराइड के रूप में लिखा जाता है और तुरंत लागू होता है।
ऊपर का Auto · English · हिन्दी स्विचर Studio की भाषा तुरंत बदलता है। यह साइडबार के भाषा स्विचर के साथ जुड़ा है, इसलिए दोनों जगह एक ही भाषा बनी रहती है।
1 · किसी लुक से शुरुआत करें
शुरुआत के लिए ग्यारह नाम वाले लुक उपलब्ध हैं। लुक एक परत है, रीसेट नहीं—यह कई डायल को एक साथ सेट करता है और उसके बाद किए गए आपके बदलावों को प्राथमिकता मिलती है।
Gallery प्रोजेक्टर के लिए हर चीज़ को अधिक स्पष्ट करता है। Nocturne कैनवस को गहरा और कमेंट को शांत करता है। Foundry मोनोक्रोम बनाता है। Clarity कॉन्ट्रास्ट को AAA तक बढ़ाता है।
2 · डायल समायोजित करें
कुल सैंतीस डायल समूहों में व्यवस्थित हैं: सतह की गहराई, गर्माहट और अलगाव · बॉर्डर का भार · टेक्स्ट कॉन्ट्रास्ट · कमेंट की प्रमुखता · सिंटैक्स पैलेट, सैचुरेशन, इटैलिक और बोल्ड · कर्सर · सिलेक्शन की तीव्रता · वर्तमान लाइन · ब्रैकेट जोड़े · इंडेंट गाइड · व्हाइटस्पेस · इनले हिंट · स्टिकी स्क्रॉल · टैब शैली · हर बार · ANSI पैलेट · शैडो · फोकस रिंग।
आपके बदले हुए हर विकल्प पर सुनहरी बिंदी दिखाई देती है और उसके पास एक-क्लिक रीवर्ट होता है।
3 · या सीधे रंग चुनें
थीम बनाने वाले सभी 107 रंग स्लॉट यहाँ मिलते हैं—सतहें, फोरग्राउंड रैम्प, लाइनें, एक्सेंट, स्टेट, सिलेक्शन, सेमांटिक्स, ANSI सेट, git सजावट और सभी 26 सिंटैक्स भूमिकाएँ। खोजें, कोई समूह खोलें और रंग चुनें। आपका चुना हुआ रंग ऊपर के हर डायल से अधिक प्राथमिकता रखता है।
4 · पठनीयता जाँचें
WCAG अनुपात और APCA Lc के साथ 81 कॉन्ट्रास्ट जोड़े लाइव जाँचे जाते हैं। असफल जोड़े सबसे ऊपर आते हैं।
5 · सहेजें या साझा करें
नाम वाला प्रीसेट सहेजें, अपनी कस्टमाइज़ेशन को JSON के रूप में क्लिपबोर्ड पर कॉपी करें,
किसी और की कस्टमाइज़ेशन पेस्ट करें या एक स्वतंत्र *-color-theme.json एक्सपोर्ट करें।
एक्सपोर्ट में निकले हुए अंतिम रंगों की जगह आपके डायल और ओवरराइड सहेजे जाते हैं, इसलिए आज साझा की गई थीम को कल जारी हुए इंजन सुधार भी मिलते हैं।
साइडबार
पैनल खोले बिना तेज़ी से काम करने के लिए:
- वैरिएंट परिवार के अनुसार समूहित हैं और हर वैरिएंट में पाँच रंगों की लाइव प्रीव्यू पट्टी है।
- एक्सेंट स्वॉच ग्रिड के रूप में मिलता है—एक क्लिक से पूरे वर्कबेंच की रंग-कुंजी बदलती है।
- रूप पिकर।
- कॉन्ट्रास्ट आपकी वर्तमान थीम का सबसे कमजोर जोड़ा और उसका परिणाम दिखाता है। पूर्ण Audit टैब खोलने के लिए उस पर क्लिक करें।
- थीम स्टूडियो खोलें, रीसेट करें, निर्यात।
- Auto · English · हिन्दी भाषा स्विचर। संकरी चौड़ाई पर इसके दृश्य लेबल Auto · EN · हिं हो जाते हैं।
इसका लेआउट 200px चौड़े संकरे साइड पैनल में भी स्थिर रहता है।
सेटिंग्स
हर डायल auricTheme.* के अंतर्गत एक वास्तविक सेटिंग है। कोई टीम अपनी साझा शैली
.vscode/settings.json में कमिट कर सकती है, ताकि सभी को समान एडिटर मिले।
{
// Studio और साइडबार की भाषा: auto · en · hi
// `auto` VS Code की डिस्प्ले भाषा का अनुसरण करता है।
"auricTheme.interfaceLanguage": "auto",
// थीम को किसी भी रंग पर फिर से आधारित करें। `inherit` वैरिएंट का अपना एक्सेंट रखता है।
"auricTheme.accent.preset": "patina",
"auricTheme.accent.custom": "#5CC9B4",
"auricTheme.accent.intensity": 120,
// सिंटैक्स
"auricTheme.syntax.palette": "cool", // jewel · vivid · pastel · mono · bullion
// classic · warm · cool · duotone
"auricTheme.syntax.italics": "off",
"auricTheme.syntax.saturation": 90,
// सतहें
"auricTheme.surface.depth": -1,
"auricTheme.surface.warmth": 20,
"auricTheme.surface.separation": "layered",
// सुरक्षा सीमाएँ
"auricTheme.a11y.enforceContrast": true,
"auricTheme.a11y.minContrast": 4.5 // 4.5 = AA, 7 = AAA
}
कमांड
| कमांड | कार्य |
|---|---|
ऑरिक थीम: थीम स्टूडियो खोलें |
पूरा पैनल खोलता है। Ctrl+Alt+; |
ऑरिक थीम: इंटरफ़ेस भाषा चुनें… |
Auto, English या हिन्दी चुनें; यही मान auricTheme.interfaceLanguage (auto, en, hi) में भी उपलब्ध है |
ऑरिक थीम: वैरिएंट बदलें… |
चौबीस वैरिएंट में से चुनें |
ऑरिक थीम: अगला वैरिएंट |
Ctrl+Alt+' |
ऑरिक थीम: एक्सेंट रंग चुनें… |
क्विक पिक से रंग-कुंजी बदलें |
ऑरिक थीम: रूप चुनें… / सिंटैक्स पैलेट चुनें… |
रूप या सिंटैक्स पैलेट चुनें |
ऑरिक थीम: इटैलिक चालू/बंद करें |
इटैलिक चालू या बंद करें |
ऑरिक थीम: मुझे चौंकाएँ |
सुरुचिपूर्ण रैंडमाइज़र—केवल चुने हुए एक्सेंट और पैलेट |
ऑरिक थीम: कॉन्ट्रास्ट रिपोर्ट दिखाएँ |
दस्तावेज़ के रूप में पूरा ऑडिट |
ऑरिक थीम: मौजूदा सेटिंग को प्रीसेट के रूप में सहेजें… / प्रीसेट लोड करें… |
प्रीसेट सहेजें या लोड करें |
ऑरिक थीम: कस्टमाइज़ेशन क्लिपबोर्ड पर कॉपी करें / क्लिपबोर्ड से कस्टमाइज़ेशन लागू करें |
क्लिपबोर्ड के माध्यम से साझा करें |
ऑरिक थीम: थीम फ़ाइल के रूप में एक्सपोर्ट करें… |
स्वतंत्र थीम JSON बनाएँ |
ऑरिक थीम: सब कुछ रीसेट करें |
साथ मिली मूल थीम पर लौटें |
एक्सेसिबिलिटी केवल दावा नहीं—इसे लागू किया जाता है
इंजन से निकलने वाला हर रंग आपके एडिटर तक पहुँचने से पहले कॉन्ट्रास्ट गार्ड से गुज़रता है। न्यूनतम सीमा से नीचे के रंग को OKLCH लाइटनेस अक्ष पर तब तक आगे बढ़ाया जाता है, जब तक वह सीमा पार न कर ले; उसका ह्यू और क्रोमा सुरक्षित रहता है।
गार्ड आपके हाथ से चुने रंगों के बाद चलता है, पहले नहीं। आपका चुना रंग एक मजबूत प्राथमिकता है, लेकिन कमेंट को अदृश्य बनाने की अनुमति नहीं।
बिल्ड हर थीम के 81 जोड़े—कुल 1,944 जाँचता है: एडिटर टेक्स्ट, सभी 26 सिंटैक्स भूमिकाएँ, टेक्स्ट वाले 14 ANSI रंग, git सजावट और हर ड्रॉपडाउन, इनपुट, चेकबॉक्स, रेडियो, बटन, बैज, मेन्यू तथा क्विक पिक के टेक्स्ट और बॉर्डर। फॉर्म कंट्रोल बॉर्डर को अपने फिल के सामने WCAG 1.4.11 का 3:1 अनुपात बनाए रखना होता है और इसे केवल दावा नहीं, वास्तव में जाँचा जाता है। कोई रंग गायब हो तो जाँच छोड़ी नहीं जाती—वह असफलता है।
यदि आप पूरी स्वतंत्रता चाहते हैं तो गार्ड बंद कर सकते हैं। ऑडिट फिर भी परिणाम दिखाता रहेगा।
दो उपयोगी बातें:
- Parchment पर प्रकाशित
#D3AF37का अनुपात 2.9:1 है—यह टिंट है, टेक्स्ट रंग नहीं। लाइट वैरिएंट इसकी जगह उपयोग योग्य Gold बनाते हैं और वॉश तथा पतली रेखाओं के लिए ब्रांड चिप रखते हैं। fg.faint—बंद कंट्रोल, घोस्ट टेक्स्ट और वॉटरमार्क—जानबूझकर गार्ड नहीं किया जाता। WCAG बंद कंट्रोल को छूट देता है; इसे चमकाने पर घोस्ट टेक्स्ट वास्तविक कोड से प्रतिस्पर्धा करेगा।
यह कैसे काम करता है
रनटाइम पर रंग थीम रजिस्टर करने का कोई समर्थित तरीका नहीं है, इसलिए कस्टमाइज़ेशन तीन सेटिंग्स में थीम-स्कोप्ड ओवरराइड लिखती है:
workbench.colorCustomizations → ["obsidian-gold"] { … }
editor.tokenColorCustomizations → ["obsidian-gold"] { textMateRules: […] }
editor.semanticTokenColorCustomizations → ["obsidian-gold"] { enabled: true, rules: {…} }
वे तुरंत लागू होते हैं, केवल सक्रिय Auric थीम पर लागू होते हैं और हटाने पर पूरी तरह साफ हो जाते हैं। दूसरी थीम के ब्लॉक और आपकी बिना-स्कोप वाली कस्टमाइज़ेशन को कभी नहीं छुआ जाता।
हर डायल अपने डिफॉल्ट पर हो तो इंजन साथ मिली हर थीम को अक्षरशः फिर से बनाता है—और
यदि ऐसा न हो तो बिल्ड असफल हो जाता है। नई, बिना बदली इंस्टॉलेशन आपके settings.json में कुछ नहीं लिखती।
बिल्ड करना
थीम फ़ाइलें जनरेट की जाती हैं। themes/*-color-theme.json को सीधे संपादित करने पर
आपके बदलाव अगली बार ओवरराइट हो जाएँगे।
npm run build themes/ और package.json दोबारा बनाएँ; किसी भी त्रुटि पर असफल हों
npm run check केवल सत्यापन करें
npm run report हर वैरिएंट की APCA सहित पूरी कॉन्ट्रास्ट तालिका दिखाएँ
npm test इंजन सुइट और शिपिंग गेट चलाएँ
npm run preview दोनों वेबव्यू रेंडर करके उनके स्क्रीनशॉट लें
npm run assets README की चित्र सामग्री दोबारा बनाएँ
npm run logo ब्रांड चिह्न फिर से बनाएँ
lib/ में इंजन है—OKLCH रंग गणित, पैलेट, 107-स्लॉट स्कीमा, 37 डायल, कंपोज़र,
वर्कबेंच और टोकन मैप तथा ऑडिट। build/ केवल टूलिंग है और एक्सटेंशन के साथ नहीं जाता।
कोई रनटाइम डिपेंडेंसी, बंडलर या नेटवर्क आवश्यकता नहीं है।
English
Twenty-four themes, and an engine to make the twenty-fifth yours.
The auricartisan.com design system, ported to VS Code in full.
Install and pick a theme
- Install Auric Artisan Theme from the Marketplace.
- Press Ctrl+K then Ctrl+T (⌘+K ⌘+T on macOS).
- Type Auric and choose one of the twenty-four.
That is the whole setup. Everything below is optional.
Prefer a menu?
Auric Theme: Switch Variant…in the Command Palette lists them with their canvas and polarity. Ctrl+Alt+' cycles.
Switch the interface language
An Interface language switcher appears in the Theme Studio top bar and below the sidebar header:
- Auto — the default; follows the VS Code display language.
- English — immediately shows the Theme Studio and sidebar in English.
- हिन्दी — immediately shows the Theme Studio and sidebar in Hindi.
The choice is shared by both panels and remembered when they are reopened. Switching language preserves the current tab, filters, expanded groups and scroll position. In a narrow sidebar the options appear as Auto · EN · हिं, with full names retained in tooltips and accessibility labels.
Command Palette commands, Settings names, view titles, walkthrough entries and other labels supplied through the extension manifest do not change with this switcher—they always follow the VS Code display language. Native VS Code notifications use that display language too; messages inside the Studio and sidebar use the language selected for those panels. To use the entire extension in Hindi:
- Install the Hindi Language Pack.
- Press Ctrl+Shift+P and run
Configure Display Language. - Select हिन्दी (
hi), then restart VS Code.
Run the same command and select English (en) to switch back. The हिन्दी · English
switcher at the top only moves between this README's Hindi and English sections; use
the switcher inside the Studio or sidebar to change those interfaces.
One accent, the whole workbench
The accent is a key, not a coat of paint. Every wash, border, selection, focus ring and cursor is derived from it — rotated in OKLCH at fixed lightness and chroma, so a sapphire lands with the same weight the gold had instead of turning to mud.
That is also how the twenty-four shipped variants are built: one family of neutrals, one accent, everything else derived.
The variants
Thirteen dark
Eleven light
| Family | Canvas | Character |
|---|---|---|
| Obsidian | #0C0C0E |
Warm charcoal — the site's own surface ramp. Eight accents. |
| Midnight | #050505 |
Near-black, for OLED panels and dark rooms. Four accents. |
| Parchment | #FFFCF7 |
Warm cream. Carries the warm accents. Four. |
| Porcelain | #FBFCFD |
Cool white. Blue, violet, teal and grey sit badly on cream; they sit here. Six. |
| High contrast | #000000 / #FFFFFF |
hc-black and hc-light, with gold borders on every control. |
All twenty-four, with their exact values
| Family | Accent | Id | uiTheme | Canvas | Accent |
|---|---|---|---|---|---|
| Obsidian | Gold | obsidian-gold |
vs-dark | #0C0C0E |
#D3AF37 |
| Obsidian | Sapphire | obsidian-sapphire |
vs-dark | #0C0C0E |
#6BA3E8 |
| Obsidian | Rose | obsidian-rose |
vs-dark | #0C0C0E |
#E08AA0 |
| Obsidian | Amethyst | obsidian-amethyst |
vs-dark | #0C0C0E |
#B48AE6 |
| Obsidian | Patina | obsidian-patina |
vs-dark | #0C0C0E |
#5CC9B4 |
| Obsidian | Emerald | obsidian-emerald |
vs-dark | #0C0C0E |
#5CC489 |
| Obsidian | Ember | obsidian-ember |
vs-dark | #0C0C0E |
#E0764A |
| Obsidian | Crimson | obsidian-crimson |
vs-dark | #0C0C0E |
#E06A6A |
| Midnight | Gold | midnight-gold |
vs-dark | #050505 |
#D3AF37 |
| Midnight | Sapphire | midnight-sapphire |
vs-dark | #050505 |
#6BA3E8 |
| Midnight | Rose | midnight-rose |
vs-dark | #050505 |
#E08AA0 |
| Midnight | Iris | midnight-iris |
vs-dark | #050505 |
#8E9BF0 |
| Parchment | Gold | parchment-gold |
vs | #FFFCF7 |
#876C00 |
| Parchment | Rose | parchment-rose |
vs | #FFFCF7 |
#A3536A |
| Parchment | Ember | parchment-ember |
vs | #FFFCF7 |
#B54F20 |
| Parchment | Emerald | parchment-emerald |
vs | #FFFCF7 |
#00804B |
| Porcelain | Sapphire | porcelain-sapphire |
vs | #FBFCFD |
#376DAE |
| Porcelain | Amethyst | porcelain-amethyst |
vs | #FBFCFD |
#8259B0 |
| Porcelain | Patina | porcelain-patina |
vs | #FBFCFD |
#007D6C |
| Porcelain | Rose | porcelain-rose |
vs | #FBFCFD |
#A3536A |
| Porcelain | Iris | porcelain-iris |
vs | #FBFCFD |
#5B65B5 |
| Porcelain | Graphite | porcelain-graphite |
vs | #FBFCFD |
#6B6B6B |
| High contrast | Gold | obsidian-gold-high-contrast |
hc-black | #000000 |
#D3AF37 |
| High contrast | Gold | porcelain-gold-high-contrast |
hc-light | #FFFFFF |
#8C7100 |
Light accents are darkened automatically until they clear AA against the side bar —
the lighter of the two surfaces an accent has to read on — which is why the light values
differ from the dark ones. #E08AA0 on parchment is a 2.1:1 colour; #A3536A is the
same rose you can actually read.
How to customise it
Open the Studio with Ctrl+Alt+;, or click the paintcan
in the status bar, or run Auric Theme: Open Theme Studio.
Nothing you do here needs a reload. Every change is written as a theme-scoped override and applies instantly.
The Auto · English · हिन्दी switcher in the top bar changes the Studio language immediately. It is linked to the sidebar language switcher, so both views stay in sync.
1 · Start from a look
Eleven named starting points. A look is a layer, not a reset — it sets a batch of dials, and anything you change afterwards still wins.
Gallery turns everything up for a projector. Nocturne deepens the canvas and quiets the comments. Foundry goes monochrome. Clarity pushes contrast to AAA.
2 · Turn the dials
Thirty-seven of them, grouped: surface depth, warmth and separation · border weight · text contrast · comment emphasis · syntax palette, saturation, italics and bold · cursor · selection strength · current line · bracket pairs · indent guides · whitespace · inlay hints · sticky scroll · tab style · every bar · the ANSI palette · shadows · focus ring.
A gold dot marks anything you have changed, with a one-click revert beside it.
3 · Or go straight to the colours
All 107 slots the theme is built from — surfaces, the foreground ramp, lines, accent, states, selection, semantics, the ANSI set, git decorations and all 26 syntax roles. Search, expand a group, pick a colour. A hand-picked value beats every dial above it.
4 · Check it is still readable
Eighty-one contrast pairs, live, with WCAG ratios and APCA Lc. Failures sort to the top.
5 · Keep it, or share it
Save a named preset, copy your customisation to the clipboard as JSON, paste someone
else's, or export a standalone *-color-theme.json.
Exports store your dials and overrides, not resolved colours — so a theme you share today picks up engine fixes shipped tomorrow.
The sidebar
For the things you want without opening a panel:
- Variants, grouped by family, each with a live five-colour preview strip.
- Accent as a swatch grid — one click re-keys the whole workbench.
- Look picker.
- Contrast — the worst pair in your current theme and whether it passes. Click it to open the Audit tab.
- Open Theme Studio, Reset, Export.
- Auto · English · हिन्दी language switcher. At narrow widths its visible labels shorten to Auto · EN · हिं.
It holds its layout down to 200px, so it works in a narrow side panel.
Settings
Every dial is a real setting under auricTheme.*, so a team can commit a house style to
.vscode/settings.json and everyone gets the same editor.
{
// Studio and sidebar language: auto · en · hi
// `auto` follows the VS Code display language.
"auricTheme.interfaceLanguage": "auto",
// Re-key the theme onto any hue. `inherit` keeps the variant's own accent.
"auricTheme.accent.preset": "patina",
"auricTheme.accent.custom": "#5CC9B4",
"auricTheme.accent.intensity": 120,
// Syntax
"auricTheme.syntax.palette": "cool", // jewel · vivid · pastel · mono · bullion
// classic · warm · cool · duotone
"auricTheme.syntax.italics": "off",
"auricTheme.syntax.saturation": 90,
// Surfaces
"auricTheme.surface.depth": -1,
"auricTheme.surface.warmth": 20,
"auricTheme.surface.separation": "layered",
// Guard rails
"auricTheme.a11y.enforceContrast": true,
"auricTheme.a11y.minContrast": 4.5 // 4.5 = AA, 7 = AAA
}
Commands
| Command | Does |
|---|---|
Auric Theme: Open Theme Studio |
The full panel. Ctrl+Alt+; |
Auric Theme: Choose Interface Language… |
Choose Auto, English or हिन्दी; the same preference is available as auricTheme.interfaceLanguage (auto, en, hi) |
Auric Theme: Switch Variant… |
Pick from the twenty-four |
Auric Theme: Cycle Variant |
Ctrl+Alt+' |
Auric Theme: Choose Accent Colour… |
Re-key from a quick pick |
Auric Theme: Choose Look… / Choose Syntax Palette… |
|
Auric Theme: Toggle Italics |
|
Auric Theme: Surprise Me |
A tasteful randomiser — curated accents and palettes only |
Auric Theme: Show Contrast Report |
The full audit as a document |
Auric Theme: Save / Load Preset… |
|
Auric Theme: Copy / Apply Customisation |
Share via the clipboard |
Auric Theme: Export as Theme File… |
A standalone theme JSON |
Auric Theme: Reset Everything |
Back to the shipped theme |
Accessibility is enforced, not claimed
Every colour the engine emits passes a contrast guard before it reaches your editor. Anything below your minimum is pushed along its OKLCH lightness axis until it clears, keeping hue and chroma intact.
The guard runs after your hand-picked colours, not before. A colour you chose is a strong preference; it is not a licence to make comments invisible.
The build audits 81 pairs per theme — 1,944 in total: editor text, all 26 syntax roles, the 14 text-bearing ANSI colours, git decorations, and the text and borders of every dropdown, input, checkbox, radio, button, badge, menu and quick pick. Form-control borders are held to WCAG 1.4.11's 3:1 against the fill they enclose, and that is checked rather than asserted. A missing colour is a failure, not a skip.
Turn the guard off if you want the freedom. The audit still reports.
Two consequences worth knowing:
- On parchment the published
#D3AF37measures 2.9:1 — it is a tint, not text. The light variants derive a working gold instead, and keep the brand chip for washes and hairlines. fg.faint— disabled controls, ghost text, the watermark — is deliberately not guarded. WCAG exempts disabled controls, and forcing it up would make ghost text compete with real code.
How it works
There is no supported way to register a colour theme at runtime, so customisation writes theme-scoped overrides into three settings:
workbench.colorCustomizations → ["obsidian-gold"] { … }
editor.tokenColorCustomizations → ["obsidian-gold"] { textMateRules: […] }
editor.semanticTokenColorCustomizations → ["obsidian-gold"] { enabled: true, rules: {…} }
They apply instantly, apply only while an Auric theme is active, and disappear cleanly when removed. Blocks belonging to other themes, and your own unscoped customisations, are never touched.
With every dial at its default the engine reproduces each shipped theme byte-for-byte
— and the build fails if it doesn't. An untouched install writes nothing to your
settings.json.
Building
The theme files are generated. Editing themes/*-color-theme.json directly will be
overwritten.
npm run build regenerate themes/ and package.json, fail on any error
npm run check validate only
npm run report the full contrast table, per variant, with APCA
npm test the engine suite plus the shipping gate
npm run preview render both webviews and screenshot them
npm run assets regenerate the README art
npm run logo redraw the brand mark
lib/ is the engine — OKLCH colour maths, the palette, the 107-slot schema, the 37
dials, the composer, the workbench and token maps, the audit. build/ is tooling and
never ships. Zero runtime dependencies, no bundler, no network.
© 2026 Auric Artisan · Licence: see LICENSE.txt in the extension · auricartisan.com