1--- 2title: "Theme test document" 3author: "Developer" 4--- 5 6# Heading level 1 (H1) 7## Heading level 2 (H2) 8### Heading level 3 (H3) 9 10This is a standard paragraph. It allows testing **bold** text, *italic* text, and ***bold and italic*** text. Let's also test ~~strikethrough~~ text. 11 12> **Important note:** This is a quote (blockquote). 13> It spans multiple lines and includes a [link to a website](https://www.rust-lang.org/). 14 15#### Lists and structures 16 17* Bullet list (level 1) 18* Next item 19 * Indented sub-item (level 2) 20 * Another sub-item with `inline code` 21 221. Numbered list (first step) 232. Second step 24 1. Sub-step A 25 2. Sub-step B 26 27#### Code blocks and media 28 29Here is a code block with language specification: 30 31```json 32{ 33 "string_key": "value", 34 "number_key": 42, 35 "boolean_key": false, 36 "null_key": null, 37 "nested": { 38 "level1": { 39 "level2": { 40 "level3": [1, [2, [3, [4]]]] 41 } 42 } 43 } 44} 45
1import os 2from datetime import datetime 3from typing import List, Dict, Optional, Union 4 5# This is a single-line comment 6""" 7Useful for verifying the color of module or function descriptions. 8""" 9 10GLOBAL_CONSTANT_PI = 3.1415926535 11 12def dummy_decorator(func): 13 """Test decorator.""" 14 def wrapper(*args, **kwargs): 15 return func(*args, **kwargs) 16 return wrapper 17 18class SyntaxTester(Exception): 19 def __init__(self, name: str, is_active: bool = True): 20 self.data_collection: List[Union[int, str]] = [1, 2, "three", 4.5] 21 self.config: Dict[str, Optional[bool]] = {"dark_mode": True, "cache": None} 22 self.nested = { 23 "level1": { 24 "level2": { 25 "level3": [ 26 [1, [2, [3, [4]]]] 27 ] 28 } 29 } 30 } 31 32 @classmethod 33 def test_colors(cls, value: int = 0) -> None: 34 if value < 0: 35 raise ValueError("Value cannot be negative") 36 37 # Test loops and formatted strings (f-strings) 38 for i in range(10): 39 formatted_string = f"Test of class {cls.__name__} - Iteration: {i}" 40 print(formatted_string) 41 42 try: 43 with open("dummy_file.txt", "r", encoding="utf-8") as file: 44 content = file.read() 45 except FileNotFoundError as error: 46 pass # Silent keyword 47
1/** 2 * @fileoverview Artificial Intelligence Core - ARN Spaceport 3 * @TODO Implement quantum computing nodes before v2.0 4 */ 5 6// Mock definitions for demonstration 7interface IConfig { [key: string]: any } 8class BaseAgent { 9 public initialize(): void {} 10 public async process(payload: string): Promise<void> {} 11} 12function Injectable(id: string) { return (ctr: Function) => {}; } 13function LogExecutionTime() { return (...args: any[]) => {}; } 14 15// Semantic analysis regex (Highlights RegExp colors) 16const TOKEN_REGEX = /^(?:[a-zA-Z_]\w*)\s*:\s*(?<value>.*)$/g; 17 18@Injectable('QuantumNode') 19export class NebulaProcessor<T> extends BaseAgent implements IConfig { 20 // Highlights 'static' (underlined) and 'readonly' (italic) modifiers 21 public static readonly MAX_THREADS: number = 42 22 private isAwake: boolean = false; 23 24 @LogExecutionTime() 25 public async analyzeData(payload: string | null): Promise<void> { 26 if (!payload) return undefined; 27 28 const dynamicId = `node_${Math.random()}`; 29 console.log(`[${dynamicId}] Starting analysis...`); 30 31 const nestedData = { 32 level1: { 33 level2: { 34 level3: [ 35 [1, [2, [3, [4]]]] 36 ] 37 } 38 } 39 }; 40 try { 41 await this.process(payload); 42 } catch (error: any) { 43 throw new Error(`Analysis failed: ${error.message}`); 44 } 45 } 46} 47// try ARN-Skin --Explore
1--- 2 3### 🦀 Rust 4 5This language is excellent for testing themes in depth thanks to its macros, lifetimes, traits, pattern matching, and raw strings. 6 7```rust 8//! Module-level documentation comment (crate level) 9//! Used to generate external documentation. 10 11#![allow(dead_code)] // Global attribute 12 13use std::collections::HashMap; 14use std::fmt::{Display, Formatter, Result}; 15 16/// Documentation comment describing a structure. 17#[derive(Debug, Clone, PartialEq)] 18pub struct ColorScheme<'a, T> { 19 name: String, 20 id_number: u32, 21 _phantom: std::marker::PhantomData<&'a T>, 22} 23 24// Trait implementation with generics and lifetimes 25impl<'a, T: Display> ColorScheme<'a, T> { 26 fn apply_color(&self) -> String { 27 // Macro usage (the "!" is often colored differently) 28 format!("Theme {}: (ID: {})", self.name, self.id_number) 29 } 30} 31 32/* * Standard multi-line comment block. 33 * Useful for long internal explanations. 34 */ 35pub fn test_syntax_highlighting(param: i32, reference: &str) -> Result { 36 // Mutable variables and vectors 37 let mut float_vector = vec![1.54_f32, 2.0, 3.14159]; 38 let byte_literal = b'A'; // Byte literal 39 40 // Nested data structure to showcase rainbow brackets 41 let nested = vec![ 42 vec![ 43 vec![ 44 vec![1, 2, 3] 45 ] 46 ] 47 ]; 48 49 let mut dictionary = HashMap::new(); 50 dictionary.insert("keyword", 100_000); 51 52 // Pattern matching (Match) 53 match param { 54 0 => println!("Exact zero"), 55 1..=10 => println!("In the range 1 to 10"), 56 _ => panic!("Panic macro execution with {:?}", dictionary), 57 } 58 59 // For loop with iterator, mutable reference and shadowing 60 for (index, value) in float_vector.iter_mut().enumerate() { 61 let index = index as f32; // Shadowing the index variable 62 *value += index; 63 } 64 65 Ok(()) 66} 67
1/* Example CSS — exercises broad CSS syntax coverage for theme audits */ 2 3@charset "UTF-8"; 4@import url("./reset.css"); 5@namespace svg url("http://www.w3.org/2000/svg"); 6 7:root { 8 --primary-color: #c0ff00; 9 --secondary-color: rgba(63, 229, 255, 0.85); 10 --spacing: clamp(1rem, 2.5vw, 2rem); 11 --radius: 0.5rem; 12 --font-stack: "Inter", system-ui, -apple-system, sans-serif; 13} 14 15/* Universal + type + id + class + attribute selectors */ 16*, 17*::before, 18*::after { 19 box-sizing: border-box; 20} 21 22@supports (backdrop-filter: blur(10px)) { 23 .glass { 24 backdrop-filter: blur(10px) saturate(1.2); 25 background: rgb(255 255 255 / 0.1); 26 } 27} 28 29/* Container query */ 30@container (min-width: 400px) { 31 .card { 32 padding: 2rem; 33 } 34} 35 36/* Vendor prefixes + !important */ 37.scrollbar { 38 -webkit-overflow-scrolling: touch !important; 39 scrollbar-width: thin; 40 scrollbar-color: var(--primary-color) transparent; 41} 42 43/* Nested at-rules to showcase rainbow brackets */ 44@media (min-width: 768px) { 45 @supports (display: grid) { 46 @container (min-width: 400px) { 47 .nested { 48 color: red; 49 } 50 } 51 } 52} 53
1<!DOCTYPE html> 2<html lang="en" data-theme="dark"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>VS Code Theme Test</title> 7 <style> 8 /* Embedded CSS to verify mixed-language detection */ 9 :root { 10 --primary-color: #ff0055; 11 } 12 .container-class { 13 background-color: rgba(25, 25, 25, 0.9); 14 font-family: 'Courier New', Courier, monospace !important; 15 margin: 10px auto; 16 } 17 </style> 18</head> 19<body> 20 <main class="container-class"> 21 <section aria-labelledby="main-title"> 22 <p> 23 Here is a paragraph with an <a href="https://example.com" target="_blank" rel="noopener">external link</a>. 24 It contains <strong>bold</strong> text, <em>italic</em> text, and an inline <code>code</code> tag. 25 </p> 26 27 <img src="placeholder.svg" alt="Image description" width="100%" height="auto" /> 28 29 <form action="/submit-endpoint" method="POST" onsubmit="return false;"> 30 <label for="user-input">Required input:</label> 31 <input type="text" id="user-input" name="data_field" placeholder="Type here..." required> 32 <button type="submit" disabled>Send data</button> 33 </form> 34 </section> 35 </main> 36 37 <script> 38 // Embedded JS to verify mixed-language detection 39 const greetingMessage = "Initialization script loaded"; 40 41 function initializeApp(configObj) { 42 const nested = { 43 level1: { 44 level2: { 45 level3: [ 46 [1, [2, [3]]] 47 ] 48 } 49 } 50 }; 51 } 52 </script> 53</body> 54</html> 55
1{ 2 "$schema": "https://json.schemastore.org/package.json", 3 "name": "arn-skin-example", 4 "version": "1.2.3", 5 "description": "Example JSON exercising broad syntax coverage for theme audits.", 6 "private": true, 7 "dependencies": { 8 "chalk": "^5.3.0", 9 "kleur": "~4.1.5", 10 "picocolors": "1.0.0" 11 }, 12 "devDependencies": { 13 "@types/node": "^20.0.0", 14 "typescript": "5.3.3", 15 "vitest": "^1.0.0" 16 }, 17 "config": { 18 "colorFormat": "hex", 19 "supportedLanguages": ["typescript", "python", "rust"], 20 "maxDepth": 12, 21 "enableCache": true, 22 "cacheTtl": null, 23 "retries": 0, 24 "ratio": 1.618, 25 "negative": -42, 26 "scientific": 1.23e-7, 27 "unicode": "\u00e9\u00e0\u00ea — hello \u4e16\u754c", 28 "escape": "line 1\nline 2\ttab\"quote\\backslash" 29 }, 30 "nested": { 31 "deeply": { 32 "structured": { 33 "arrays": [ 34 [1, 2, 3], 35 ["a", "b", "c"], 36 [true, false, null] 37 ], 38 "mixed": [ 39 { "id": 1, "active": true }, 40 { "id": 2, "active": false, "meta": null } 41 ] 42 } 43 } 44 } 45} 46
1#!/usr/bin/env bash 2# Example shell script — exercises broad bash syntax coverage for theme audits 3# shellcheck disable=SC2034 4 5set -euo pipefail 6IFS=$'\n\t' 7 8# Constants and variables 9readonly SCRIPT_DIR="$(cd -- "$(dirname -- "${BASH_SOURCE[0]}")" &>/dev/null && pwd)" 10readonly LOG_FILE="${SCRIPT_DIR}/build.log" 11declare -a TARGETS=("spaceport" "uranus" "neptune" "nebula" "mars" "io" "jupiter") 12declare -A COLORS=( 13 [io]="#c0ff00" 14 [neptune]="#3fe5ff" 15 [jupiter]="#d99815" 16) 17 18# Main loop 19for theme in "${TARGETS[@]}"; do 20 # Arithmetic 21 count=$(( count + 1 )) 22done 23 24# Subshell + pipeline 25( 26 cd "$BUILD_DIR" 27 find . -name '*.json' -print0 | xargs -0 -n 1 jq '.name' 2>/dev/null | sort -u 28) 29 30# Case statement 31case "${1:-help}" in 32 build|b) print_banner "BUILD" ;; 33 test|t) print_banner "TEST" ;; 34 clean|c) rm -rf "$BUILD_DIR" && echo "cleaned" ;; 35 help|-h|*) echo "Usage: $0 {build|test|clean|help}" ; exit 0 ;; 36esac 37 38# Nested subshells and parameter expansion to showcase rainbow brackets 39deep=$( 40 echo $( 41 echo $( 42 echo $( 43 echo "deep" 44 ) 45 ) 46 ) 47) 48nested_var=${a:-${b:-${c:-${d:-default}}}} 49 50# Exit code 51exit 0 52
1-- Example SQL — exercises broad SQL syntax coverage for theme audits 2-- Comments: single-line and /* block comment */ 3 4/* Schema definition with foreign keys, check constraints, indexes */ 5CREATE SCHEMA IF NOT EXISTS arn; 6 7CREATE TABLE arn.themes ( 8 id SERIAL PRIMARY KEY, 9 name VARCHAR(64) NOT NULL UNIQUE, 10 bg_color CHAR(7) NOT NULL, 11 signature CHAR(7) NOT NULL, 12 is_light BOOLEAN NOT NULL DEFAULT FALSE, 13 created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP, 14 metadata JSONB, 15 CONSTRAINT chk_bg_format CHECK (bg_color ~ '^#[0-9a-fA-F]{6}$') 16); 17 18CREATE INDEX idx_themes_name ON arn.themes (LOWER(name)); 19 20/* Seed data */ 21INSERT INTO arn.themes (name, bg_color, signature, is_light, metadata) VALUES 22 ('spaceport', '#121416', '#e8d44c', FALSE, '{"planet": "earth-orbit"}'), 23 ('io', '#0e100a', '#c0ff00', FALSE, '{"planet": "jupiter-moon"}'), 24 ('neptune', '#050B1C', '#3FE5FF', FALSE, '{"planet": "neptune"}'), 25 ('jupiter', '#fdfbf5', '#d99815', TRUE, '{"planet": "jupiter"}'); 26 27/* Complex query: CTEs, window functions, joins, aggregation */ 28WITH theme_stats AS ( 29 SELECT 30 t.id, 31 t.name, 32 t.is_light, 33 COUNT(*) OVER (PARTITION BY t.is_light) AS peer_count, 34 ROW_NUMBER() OVER (ORDER BY t.created_at) AS rn, 35 RANK() OVER (ORDER BY LENGTH(t.name) DESC) AS name_rank 36 FROM arn.themes AS t 37 WHERE t.created_at >= CURRENT_DATE - INTERVAL '30 days' 38) 39SELECT * FROM theme_stats LIMIT 10; 40 41-- Nested subqueries to showcase rainbow brackets 42SELECT * FROM ( 43 SELECT id FROM ( 44 SELECT id FROM ( 45 SELECT id FROM arn.themes WHERE id = 1 46 ) 47 ) 48); 49
Algorithmic generation, human refinement, cross-language architecture
The palette was first generated algorithmically: real source files in nine languages are tokenized with Microsoft TextMate grammars, candidate hex values are sampled in OKLCH space, and simulated annealing assigns colors to scopes by minimizing pairwise CIE76 ΔE collisions and maximizing chromatic diversity. The output was then extensively refined by hand across many iterations to handle visual conflicts the automated metrics could not see — semantic mismatches between hue family and meaning, awkward neighbors in real code, perceived warmth/coldness of the overall composition, and per-language identity preferences.
The theme is built around general TextMate scope rules that apply to every supported language — concepts like keyword.control, string, entity.name.function, storage.type, punctuation.definition.string, etc. A small number of language-specific rules override the defaults only when the visual context truly demands it (Python support.function.builtin.python vs. generic support.function, Rust entity.name.namespace.rust, JSON support.type.property-name.json, etc.). This architecture keeps the cross-language palette coherent — a string is a string everywhere — while preserving each language's unique syntactic identity. Rainbow brackets follow the same logic: cumulative composed selectors (meta.block.ts meta.block.ts punctuation.definition.block.ts) gradient through saturated colors as nesting deepens.
Quality criteria enforced and verified per theme:
ΔE ≥ 12 between co-occurring tokens (within the same language file).ΔE ≥ 15 contrast against the editor background.Code samples on this page are rendered in 0xProto, a programming font designed for legibility at small sizes — chosen here for its disambiguated glyphs, programming ligatures, and stable rendering across operating systems.
Real measurements computed below from the actual tokens rendered in the samples above:
Per-language palettes — colors sorted by OKLCH luminance (brightest first). Hover a swatch to see the rule name and example tokens. Each per-color swatch shows usage count, WCAG ratio, and CIE76 ΔE vs. background (a ! marks the rare colors below the ΔE 15 threshold).