muowl
PTEN

VS Code · v1.7.0

Carmilla

calor de cripta para noites de código

Três variantes para VS Code: vinho rosado, violeta e azul-ardósia. Texto creme, comentários malva e cores distintas para tipos, funções e strings. Compare Carmilla, Amethyst e Moonstone no exemplo de código.

No editor

prévia com as regras de sintaxe do tema para TypeScript

carmilla / countess.ts
countess.ts
palette.css
README.md
// Carmilla — warm accents over wine.
// TextMate preview; language servers may refine token colors.
class Countess {
    private name: string;
    private centuriesLived: number;

    constructor(name: string, age: number) {
        this.name = name;
        this.centuriesLived = age;
    }

    whisper(guest: string): string {
        return `${this.name} whispers to ${guest}`;
    }

    getEra(): string {
        if (this.centuriesLived > 5) return "Ancient";
        if (this.centuriesLived > 1) return "Immortal";
        return "Newly turned";
    }
}

const carmilla = new Countess("Mircalla Karnstein", 3);
const awake: boolean = true;
const visitor: string | null = null;
const absent = undefined;
if (awake) console.log(carmilla.getEra());
else console.error("Still resting in the coffin");
⎇ main↑ 2 ↓ 0 0 errors▲ 1 warning
Ln 21, Col 9Spaces: 4UTF-8TypeScriptCarmillaCarmilla AmethystCarmilla Moonstone

Instalar Carmilla

Instale a extensão e abra “Preferences: Color Theme” na paleta de comandos do VS Code para escolher o tema.

Para instalar o pacote, use “Extensions: Install from VSIX…” no VS Code.

A versão 1.7.0 inclui Moonstone e o ícone Lua. Baixe o VSIX para instalar esta versão enquanto a atualização do Marketplace está pendente.

A paleta

as treze cores do Carmilla e seus usos

#16101A#18101A#0F1319
CryptCryptCrypt
background mais profundo — página, gutter
#2E1B2D#2A1B2E#1D232E
BoudoirBoudoirBoudoir
background principal — editor, painéis
#3A2438#35243A#252D3B
VelvetVelvetVelvet
superfície elevada — cards, status bar
#523950#4C3952#384355
SelectionSelectionSelection
linha atual, seleção, ranges
#FF5FA2#C474D3#75A6D8
CarmineAmethystMoonstone
keywords, storage — const, let, class, if, return
#D5A6FF#D5A6FF#D5A6FF
WisteriaWisteriaWisteria
instâncias — this, super, null
#5ED0D8#5ED0D8#5ED0D8
VerdigrisVerdigrisVerdigris
classes, tipos, suporte
#7AE0A6#7AE0A6#7AE0A6
AbsintheAbsintheAbsinthe
funções, métodos
#EDD795#EDD795#EDD795
ChampagneChampagneChampagne
strings, template literals
#FFAE8A#FFAE8A#FFAE8A
Peach VelvetPeach VelvetPeach Velvet
números, booleanos
#E84B6E#E84B6E#E84B6E
PomegranatePomegranatePomegranate
erros, deleções, alertas
#9E83A4#9E83A4#9E83A4
Ash MauveAsh MauveAsh Mauve
comentários
#F5EADA#F5EADA#F5EADA
PearlPearlPearl
texto principal, foreground

Cores da sintaxe

a cor usada em cada elemento do código

keywordconst x = "…"
variable.langthis.name
entity.type: string
entity.functionlog()
string"Carmilla"
constant.numeric42
invalidundefined_var
comment// ash mauve
variableguest

Variantes

compare as paletas e selecione uma variante

Carmilla usa vinho rosado e carmim; Amethyst combina violeta e ametista; Moonstone traz azul-céu sobre ardósia. Texto creme, comentários malva e as demais cores de sintaxe são compartilhados. Selecione uma variante para comparar a paleta e o código.

← Todos os temas