🌈 Rainbow Spaces

Make every space a little more colorful.

A VS Code extension that turns ordinary spaces into 🌈 — purely visually.

Your source code stays 100% unchanged.

⌨️ Toggle: Ctrl + Alt + R

---

✨ What is Rainbow Spaces?

Rainbow Spaces gives your spaces a little personality.

Normally, your code looks like this:

const message = "Hello world";

With Rainbow Spaces enabled, it looks like this:

const🌈message🌈=🌈"Hello🌈world";

But here's the important part:

🌈 The rainbow emojis are visual only. They are NOT added to your source code.

Your actual file still contains:

const message = "Hello world";

---

🎨 See It In Action

Before

function greet(name) {
    console.log("Hello " + name);
}

With Rainbow Spaces

function🌈greet(name)🌈{
🌈🌈🌈🌈console.log("Hello🌈"🌈+🌈name);
}

What's Actually Saved

function greet(name) {
    console.log("Hello " + name);
}

Nothing is changed.

---

🔥 Why Rainbow Spaces?

Feature	Rainbow Spaces
🌈 Rainbow spaces in VS Code	✅
📝 Modifies your source code	❌
🧠 Compiler sees normal spaces	✅
📋 Copy & paste stays normal	✅
🔀 Git diffs stay clean	✅
🛠️ Formatters work normally	✅
💡 Language servers work normally	✅
📁 Other editors see normal code	✅

The rainbow is for your eyes.

Your code stays untouched.

---

⚡ Features

🌈 Visual Rainbow Spaces

Every ordinary space gets a beautiful rainbow decoration.

🛡️ Zero Source-Code Modification

Rainbow Spaces uses the VS Code decoration API instead of replacing characters in your files.

Your actual source code remains unchanged.

📋 Normal Copy & Paste

Copying code copies the actual source code, including normal spaces.

The visual 🌈 decorations are not copied.

⚡ Lightweight

Rainbow Spaces uses debounced decoration updates to avoid unnecessary work while you're typing.

⌨️ Quick Toggle

Turn Rainbow Spaces on or off with:

Ctrl + Alt + R

Or open the Command Palette and run:

Rainbow Spaces: Toggle

---

🚀 Installation

VS Code Marketplace

Search for:

Rainbow Spaces

in the VS Code Extensions panel.

Install from a VSIX

If you have downloaded or built a .vsix package:

code --install-extension rainbow-spaces-0.1.0.vsix

Then reload VS Code.

---

🎮 Usage

1. Open VS Code.
2. Open any source file.
3. Press Ctrl + Alt + R.
4. Enjoy the 🌈.

Press Ctrl + Alt + R again to turn Rainbow Spaces off.

You can also use:

Ctrl + Shift + P

and search for:

Rainbow Spaces: Toggle

---

🧪 Does Rainbow Spaces Modify My Files?

No.

This:

hello🌈world

is what you see in VS Code.

The actual document contains:

hello world

The 🌈 is created by a VS Code editor decoration.

You can verify it yourself

1. Enable Rainbow Spaces.
2. Save your file.
3. Close VS Code.
4. Open the file in another text editor.

You'll see the normal spaces.

---

🧠 How It Works

Rainbow Spaces does not replace spaces.

Instead, it adds a visual decoration on top of them:

                 YOUR SOURCE CODE

                    hello world
                         │
                         │
                         ▼
              ┌──────────────────┐
              │   VS Code Editor │
              │    Decoration    │
              └────────┬─────────┘
                       │
                       ▼
                  hello🌈world

The underlying TextDocument always contains the original text.

This means your:

• Compiler
• Formatter
• Linter
• Language Server
• Git
• Copy & Paste

all continue to work with the real source code.

---

💻 Works With Your Code

Rainbow Spaces works at the editor level, so it isn't tied to a specific programming language.

You can use it with:

• 🟨 JavaScript
• 🔷 TypeScript
• 🐍 Python
• ⚙️ C
• 🛠️ C++
• 🟪 C#
• ☕ Java
• 🦀 Rust
• 🐹 Go
• 🌐 HTML
• 🎨 CSS
• 🗂️ JSON
• 📝 Markdown

And many more.

---

🔀 Git-Friendly

Because Rainbow Spaces doesn't modify your files, enabling it won't create giant Git diffs.

For example, Git still sees:

- const message = "Hello";
+ const message = "Hello world";

Not:

- const message = "Hello";
+ const🌈message🌈=🌈"Hello🌈world";

Your Git history stays clean.

---

🤝 Contributing

Found a bug?

Have an idea?

Want to make the rainbows even more ridiculous? 🌈

Contributions are welcome!

Repository

https://github.com/AkshayNachappa/rainbow-spaces

Feel free to:

• 🐛 Report bugs
• 💡 Suggest features
• 🔧 Submit pull requests
• ⭐ Star the project

---

📜 License

This project is licensed under the MIT License.

Copyright © Akshay Nachappa

---