Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

114
Views
how to fill text color with the same preload image color in p5js

I want to set/fill my text(avg 450 words) color with the same color of preload image to my canvas in P5js / JS. Is anybody can help me with how to do that?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

You want to get the colour of an image and then fill with that colour so the text will be the same colour.

Here's a link to the documentation for the get() method which is what you're looking for.

In order to do this, we use the get(x, y) method to get the pixel at a specific location, this returns us an RGBA value which we can use to fill.

I've put together a really simple example to demonstrate this:

let img;
function preload() {
  img = loadImage('img.jpg');
}

function setup() {
  createCanvas(400, 400);
  image(img, 0, 0);
  let c = get(0, 0);
  fill(c);
}

function draw() {
  background(0);
  image(img, 0, 0);
  textSize(20);
  text('I am the same colour', 100, 350);
}

I'm just grabbing the very first pixel and filling with that. Here's a link to a p5.js sketch so you can see it running.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!