Skip to content

docs: add documentation for mix() method in p5.strands#8463

Open
Anshumancanrock wants to merge 1 commit intoprocessing:dev-2.0from
Anshumancanrock:mix
Open

docs: add documentation for mix() method in p5.strands#8463
Anshumancanrock wants to merge 1 commit intoprocessing:dev-2.0from
Anshumancanrock:mix

Conversation

@Anshumancanrock
Copy link

@Anshumancanrock Anshumancanrock commented Jan 28, 2026

Resolves #8441

Changes:

Added documentation for the mix() method in p5.strands. This GLSL built-in function was already implemented but missing from the reference documentation.

The documentation includes:

  • Method description and usage notes
  • Parameter and return type documentation
  • Three examples showing color blending, vertex manipulation, and gradient creation

PR Checklist

@welcome
Copy link

welcome bot commented Jan 28, 2026

🎉 Thanks for opening this pull request! For guidance on contributing, check out our contributor guidelines and other resources for contributors!
🤔 Please ensure that your PR links to an issue, which has been approved for work by a maintainer; otherwise, there might already be someone working on it, or still ongoing discussion about implementation. You are welcome to join the discussion in an Issue if you're not sure!
🌸 Once your PR is merged, be sure to add yourself to the list of contributors on the readme page !

Thank You!

* let gradient = pixelInputs.uv.x;
* let color1 = vec3(1, 0.5, 0); // Orange
* let color2 = vec3(0.5, 0, 1); // Purple
* pixelInputs.color = vec4(mix(color1, color2, gradient), 1);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Heads up, you may need to set pixelInputs.ambientColor = pixelInputs.color.rgb to avoid the default color still being used for ambient light.

Separately, we may want to open an issue to decide how to deal with that, since its somewhat unintuitive and a pretty common use case.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Heads up, you may need to set pixelInputs.ambientColor = pixelInputs.color.rgb to avoid the default color still being used for ambient light.

Separately, we may want to open an issue to decide how to deal with that, since its somewhat unintuitive and a pretty common use case.

Agreed, it does seem unintuitive that ambient color doesn't automatically follow the material color. Opening a separate issue would be a good idea. I will open one soon .

@davepagurek
Copy link
Contributor

I think this generally looks good, would you mind testing the examples in the p5.js-website repo (see instructions here https://github.com/processing/p5.js-website/blob/main/docs/scripts.md#testing-the-docs-of-your-fork) and showing screenshots of each? This also helps ensure they run correctly.

@Anshumancanrock Anshumancanrock force-pushed the mix branch 2 times, most recently from b1f7b3e to fb9dd40 Compare February 8, 2026 21:55
@Anshumancanrock
Copy link
Author

@davepagurek Thanks for the heads up! I've updated examples to use pixelInputs.ambientColor = pixelInputs.color.rgb. Should be cleaner this way.

@Anshumancanrock
Copy link
Author

@davepagurek I tested the examples locally on the p5.js-website by building the reference from my fork's branch. The mix() page renders correctly with all three examples. Here is the video:

ps51.mp4

The description, syntax, parameters, and all three examples (basic color mix, position-based mix, gradient mix) show up as expected.

Please let me know if you would like any further changes. Thank you :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants