mirror of
https://github.com/RGBCube/serenity
synced 2025-05-16 20:15:07 +00:00
35 lines
904 B
HTML
35 lines
904 B
HTML
<link rel="match" href="reference/canvas-fillstyle-rgb.html" />
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
}
|
|
|
|
body {
|
|
background-color: white;
|
|
}
|
|
</style>
|
|
<canvas width=500 height=500></canvas>
|
|
<script type="text/javascript">
|
|
const canvas = document.querySelector("canvas");
|
|
const ctx = canvas.getContext("2d");
|
|
|
|
// Integer numbers
|
|
ctx.fillStyle = "rgb(0,255,0)";
|
|
ctx.fillRect(0, 0, 500, 100);
|
|
|
|
// Decimal numbers
|
|
ctx.fillStyle = "rgb(0.28813966673057,254.56022744510793,0.2973971574794)";
|
|
ctx.fillRect(0, 100, 500, 100);
|
|
|
|
// Numbers below 0 and above 255 should be clamped
|
|
ctx.fillStyle = "rgba(-50,500,-50,1)";
|
|
ctx.fillRect(0, 200, 500, 100);
|
|
|
|
// Percentages
|
|
ctx.fillStyle = "rgb(0%, 100%, 0%)";
|
|
ctx.fillRect(0, 300, 500, 100);
|
|
|
|
// Calc
|
|
ctx.fillStyle = "rgb(0, calc(infinity), 0)";
|
|
ctx.fillRect(0, 400, 500, 100);
|
|
</script>
|