adding properties to color object

[rruubboott]

Increasing access

By simplifying a process, making information more easily accessible by beginners.

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build process
• Unit testing
• Internationalization
• Friendly errors
• Other (specify if possible)

Feature enhancement details

The color object's r,g,b and a values could be accessible via literal properties called r,g,b,a (or at a push red, green,blue etc.)
So that is to say you could get access to the Red value of a color object via:
color.r or color.red
and not have to go into:
color.levels[0]

[LalitNarayanYadav]

This is a great idea—accessing color components directly via color.r, color.g, color.b, and color.a would definitely make the API more intuitive, especially for beginners. It improves readability and aligns well with p5.js’s focus on accessibility and simplicity.

Relevant sub-areas: Color, Accessibility.

I'd be happy to contribute to this! Could you please point me to the relevant file(s) or location in the codebase where this change should be made?

[ksen0]

This is a good idea for the more object-oriented use of color, however since objects are already not a beginner-level topic, the easiest way to access these values is using blue(c) where c is the color object. The same is available for alpha, red, hue, and so on:

Though it's possible to duplicate the functionality on the object too, this creates a maintenance challenge, so I'll close this issue for now, however it could be considered in the future.

@LalitNarayanYadav @rruubboott if either of you want to work on adding examples exploring color-related functions and making them more visible, you can check out the existing examples and propose some examples on the p5.js-website repo!