Click on a key to see its corresponding color:
Click on any notation to see its color:
The package supports pitch classes (0-11) and MIDI numbers:
Switch between different color palettes:
// Install the package
npm install note-color
// Import the package
import getNoteColor, { getAvailablePalettes, PALETTES } from 'note-color';
// Basic usage - get color by note name
const cColor = getNoteColor('C'); // Returns "#e23058"
// Get color for different note formats
getNoteColor('Bb'); // Same as A#: "#a247be"
getNoteColor('c#'); // Works with lowercase: "#f7583a"
getNoteColor('do'); // Latin solfège for C: "#e23058"
getNoteColor('sol#'); // Latin solfège for G#: "#3161a3"
getNoteColor('ré'); // Accented solfège: "#f8943e"
// Get color by MIDI number
getNoteColor(60); // Middle C: "#e23058"
getNoteColor(61); // C#: "#f7583a"
// Get color by pitch class (0-11)
getNoteColor(0); // C: "#e23058"
getNoteColor(7); // G: "#11826e"
// Pitch class wrapping (modulo 12)
getNoteColor(12); // Same as 0 (C): "#e23058"
getNoteColor(-1); // Same as 11 (B): "#e957b2"
// Get full information including name
const noteInfo = getNoteColor('F', { fullInfo: true });
// Returns: { note: 'F', name: 'Yellow-Green', hex: '#95c531' }
// Use predefined palettes
getNoteColor('C', { paletteId: 'pastel' }); // "#ffb3ba"
getNoteColor('D', { paletteId: 'monochrome' }); // "#333333"
// See available palettes
const palettes = getAvailablePalettes(); // ["default", "pastel", "monochrome"]
// Create a custom palette
const customPalette = [
{ note: 'C', name: 'Custom Red', hex: '#ff0000' },
{ note: 'D', name: 'Custom Blue', hex: '#0000ff' },
// ... etc
];
// Use custom palette
getNoteColor('C', { palette: customPalette }); // "#ff0000"
// Handle errors silently
getNoteColor('Z', { failSilently: true }); // null instead of throwing