A cheerful light theme with soft rose pastels, pure crimson accents and ladybug SVG file icons.
Color Theme
A light theme built around a rose & crimson palette — easy on the eyes, bold on style.
| Element | Color |
|---|---|
| Editor background | #FFF6F7 soft rose white |
| Title & Status bar | #E31414 pure crimson |
| Activity bar | #FFE5EC rose pastel |
| Sidebar | #FFF0F2 blush white |
| Active tabs | #FFB3C6 rose pastel |
| Inactive tabs | #E31414 crimson + white text |
| Keywords | #E04F4F soft red |
| Functions | #FF4D6D rose red |
| Strings | #FF8FA3 pink |
| Comments | #F78B8B light rose italic |
| Numbers | #E31414 crimson bold |
Syntax support
JavaScript · TypeScript · JSX · TSX · CSS · SCSS · HTML · Python · Go · Rust · Java · PHP · Ruby · C/C++ · C# · Markdown · JSON · YAML · GraphQL · SQL · Regex
🐞 Ladybug Icon Theme
Every file gets a ladybug icon — the original facing right, or mirrored for variety. No two file types look exactly the same.
.js.jsx.html.json.py.rs→ 🐞 facing right.ts.tsx.css.scss.md.yml→ 🐞 mirrored- Special larger icons for
package.json,tsconfig.json,README.md,Dockerfileand more
Installation
From the Marketplace
Search Red Rose Ladybug in the VS Code Extensions panel, click Install.
Activate the color theme
Ctrl/Cmd + Shift + P → Preferences: Color Theme → 🐞 Red Rose Ladybug
Activate the icon theme
Ctrl/Cmd + Shift + P → Preferences: File Icon Theme → 🐞 Ladybug Icons
Recommended settings
Add to your settings.json for the best experience:
{
"editor.fontFamily": "'Fira Code', 'Cascadia Code', monospace",
"editor.fontLigatures": true,
"editor.fontSize": 14,
"editor.lineHeight": 1.6,
"workbench.colorTheme": "🐞 Red Rose Ladybug",
"workbench.iconTheme": "red-rose-ladybug-icons"
}