Nain: Nature Luxury

Name: Nain: Nature Luxury
Author: nain-studio

Publisher: nain-studioThemes in package: 6

A premium suite of nature-inspired themes: Slate, Sage, and Earth aesthetics.

Open in VS Code GitHub

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Nain: Nature Luxury — Nain Slate Dark

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#0D1821
button.background#344966
button.border#344966
button.foreground#E9F0F8
button.hoverBackground#3F5B7A
button.secondaryBackground#1B2A38
button.secondaryForeground#E9F0F8
button.secondaryHoverBackground#253746
dropdown.background#0D1821
dropdown.border#34496688
editor.background#0D1821
editor.foreground#E9F0F8
editor.lineHighlightBackground#34496633
editorGroupHeader.tabsBackground#0D1821
editorLineNumber.activeForeground#B4CDED
focusBorder#344966
input.background#0D1821
input.border#34496688
input.foreground#E9F0F8
list.activeSelectionBackground#34496688
list.hoverBackground#34496644
menu.background#101D29
menu.foreground#E9F0F8
menu.selectionBackground#1B2A38
menu.separatorBackground#344966
menubar.selectionBackground#34496666
panel.background#0D1821
panelHeader.border#34496644
panelInput.background#0D1821
panelInput.border#34496688
panelSectionHeader.background#0D1821
quickInput.background#101D29
quickInput.foreground#E9F0F8
quickInputList.focusBackground#1B2A38
sideBar.background#0D1821
sideBar.foreground#7D92AD
statusBar.background#0D1821
statusBar.border#34496644
statusBar.foreground#7D92AD
tab.activeBackground#101D29
tab.inactiveBackground#0D1821
terminal.background#0D1821
titleBar.activeBackground#0D1821

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
keyword, storage.type, storage.modifier, keyword.control	#B4CDED	bold
entity.name.function, support.function, variable.function	#70D6FF	bold
string, punctuation.definition.string	#95D5B2	—
constant.numeric	#FFD6BA	bold
comment, punctuation.definition.comment	#344966	italic
variable, variable.other, variable.parameter	#E9F0F8	—
constant.language, support.constant	#FFB7FF	bold
entity.name.tag, punctuation.definition.tag	#B4CDED	—
entity.other.attribute-name	#7D92AD	italic
entity.name.type, entity.name.class, support.class, support.type	#CAFFBF	underline
keyword.operator, punctuation, meta.brace	#7D92AD	—