Rainbow Functions

A Visual Studio Code extension designed to enhance your coding experience by highlighting matching function calls and definitions across editor views. Whether you're navigating large codebases or working across multiple files, Rainbow Functions ensures that function and class usage remains clear and easily identifiable.

Table of Contents

• Features
• Demo
• Marketplace Installation
• Local Installation
• Usage
• Contributing
• Issues
• License

Features

🌈 Consistent Color Highlighting: Functions and classes retain their assigned colors as they scroll in and out of view, ensuring easy identification.

🪟 Cross-View Highlighting: Highlights matching functions and classes visible in multiple editor views or windows.

🧬 Class Linking: Keeps class declarations, constructor calls, and extends references glowing together so you always know where a class comes from and where it’s used.

⚙️ Customizable Settings: Configure options like highlightSameFile, requireDefinitionAndCall, and styling preferences to tailor the extension to your workflow.

🎯 Sticky Color Assignments: A smart cache keeps functions tied to the same color so long as they stay in the palette rotation, making it easy to track a symbol across files without random recolors.

⚡ Efficient Performance: Optimized to handle large codebases without significant performance overhead.

🎚️ Toggle Functionality: Easily enable or disable the extension as needed via the Command Palette or keyboard shortcuts.

Demo

Marketplace Installation

Install Rainbow Functions from the VS Code Marketplace and start highlighting matching functions instantly.

Local Installation

To install Rainbow Functions locally:

1. Clone the Repository:

   git clone https://github.com/niZmosis/rainbow-functions.git
   

   Note: Replace the URL with your actual repository link if different.

2. Navigate to the Extension Directory:

   cd rainbow-functions
   

3. Install Dependencies:

   pnpm install
   

4. Build the Extension:

   pnpm compile
   

5. Package the Extension:

   vsce package
   

   • This will generate a .vsix file in the root directory.

6. Install the Extension:

   • Open VSCode.
   • Go to the Extensions view (Ctrl+Shift+X or Cmd+Shift+X).
   • Click on the ... menu in the top-right corner and select "Install from VSIX...".
   • Navigate to your generated .vsix file and install it.

7. Reload VSCode:

   • When prompted, reload VSCode to activate the extension.

Usage

Enable/Disable the Extension

• Toggle via Editor Title Button:

  • Click the color-wheel icon in the editor title bar (top-right of the active editor) to instantly enable or disable highlighting.
  • You can hide this button via the rainbowFunctions.showEditorButton setting.

• Toggle via Command Palette:

  1. Open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P).
  2. Type Toggle Rainbow Functions and press Enter to enable or disable the extension.

• Toggle via Keyboard Shortcut (Optional):

  • You can assign a keyboard shortcut to the toggle command for quicker access.
  • Go to File > Preferences > Keyboard Shortcuts.
  • Search for Toggle Rainbow Functions and assign your preferred shortcut.

Commands Overview

All Rainbow Functions commands are available from the Command Palette (Ctrl+Shift+P / Cmd+Shift+P):

• Rainbow Functions: Toggle – enable or disable highlighting (also available via the toolbar button).
• Rainbow Functions: Reset Colors – restore the default color palette.
• Rainbow Functions: Reset Border Styles – revert to the default solid/dotted/dashed rotation.
• Rainbow Functions: Factory Reset Palette – reset both colors and border styles.
• Rainbow Functions: Import Colors – load colors from a JSON/CSV/plain-text file.
• Rainbow Functions: Reorder Colors – open the Quick Pick UI to reorder the palette.
• Rainbow Functions: Reorder Border Styles – reorder the border-style rotation.

Use the gear button beside each setting in the Settings UI to access the corresponding commands inline.

Palette Management

• Import Colors from File: Run Rainbow Functions: Import Colors to select a JSON, CSV, or plain-text file. Provide colors as a JSON array (["#ff0000", "rgb(0,255,0)"]) or as newline/comma separated values.
• Reorder Colors: Use Rainbow Functions: Reorder Colors to adjust palette order from a Quick Pick with inline move buttons.
• Reset Colors: Restore the default palette via Rainbow Functions: Reset Colors.
• Reset Border Styles: Revert border rotation with Rainbow Functions: Reset Border Styles.
• Reorder Border Styles: Use Rainbow Functions: Reorder Border Styles to change the rotation sequence for border styles.
• Factory Reset Palette: Reset both colors and border styles with Rainbow Functions: Factory Reset Palette.

Configuration

Customize Rainbow Functions to fit your preferences by adjusting settings in your settings.json file:

{
  "rainbowFunctions.enable": true,
  "rainbowFunctions.highlightSameFile": true,
  "rainbowFunctions.requireDefinitionAndCall": true,
  "rainbowFunctions.highlightOpacity": 0.1,
  "rainbowFunctions.highlightBorderOpacity": 0.6,
  "rainbowFunctions.highlightBorderRadius": 0,
  "rainbowFunctions.highlightBorderWidth": 1,
  "rainbowFunctions.highlightApplyDelayMs": 0,
  "rainbowFunctions.highlightRemoveDelayMs": 0
}

Settings Description:

• rainbowFunctions.enable (boolean): Enable or disable the Rainbow Functions extension.
• rainbowFunctions.highlightSameFile (boolean): Enable highlighting of functions and classes within the same file.
• rainbowFunctions.requireDefinitionAndCall (boolean): Require a visible definition and call/constructor before highlighting. Disable to highlight whenever there are multiple visible occurrences of the same symbol.
• rainbowFunctions.highlightOpacity (number): Set the highlight opacity (range: 0 to 1).
• rainbowFunctions.highlightBorderOpacity (number): Set the highlight border opacity (range: 0 to 1).
• rainbowFunctions.highlightBorderRadius (number): Set the highlight border radius in pixels.
• rainbowFunctions.highlightBorderWidth (number): Set the highlight border width in pixels.
• rainbowFunctions.highlightApplyDelayMs (number): Delay (in milliseconds) before new highlights appear. Useful for throttling updates while typing.
• rainbowFunctions.highlightRemoveDelayMs (number): Delay (in milliseconds) before existing highlights disappear. Lets highlights linger briefly after you move the cursor.

Localization

Rainbow Functions ships with English and Spanish strings for both the VS Code contributions (package.nls*.json) and the runtime UI (l10n/bundle.l10n*.json). To add or update translations:

1. Change any user-facing strings inside src/ and run pnpm run extract:l10n to refresh l10n/bundle.l10n.json.
2. Copy the updated entries into the corresponding locale files (for example package.nls.es.json and l10n/bundle.l10n.es.json).
3. Repeat for any new language by adding matching package.nls.<locale>.json and l10n/bundle.l10n.<locale>.json files.
4. Rebuild (pnpm compile) or run the extension to verify the translated UI in VS Code.

Need another language? Follow the steps above and open a pull request—even partial translations are welcome.

The function/name cache automatically scales to colors × borderStyles, so removing colors or border styles reduces the cache, while adding them expands it.

Contributing

Bug reports, feature ideas, and pull requests are always appreciated.
See CONTRIBUTING.md for environment setup, workflows, and PR guidelines.

Issues

Please open issues and feature requests on the GitHub tracker.

License

This project is licensed under the ISC License – see the LICENSE file for details.