Skip to content
Related Articles

Related Articles

Improve Article

Fabric.js sourceFromRgb() Method

  • Last Updated : 19 Mar, 2021
Geek Week

The sourceFromRgb() method is used to return an array representation of color for the specified color values in RGB (Red Green Blue) or RGBA (Red Green Blue Alpha) format.

Syntax:

sourceFromRgb(color)

Parameters: This method accepts a parameter as mentioned above and described below:

  • color: This parameter holds the specified color values in RGB or RGBA format.

Return Value: This method returns an array representation of values in RGBA (Red Green Blue and Alpha) format of the color for the specified color values in RGB or RGBA format.

Example 1:



HTML




<!DOCTYPE html>
<html>
  
<head>
  <!-- Adding the FabricJS library -->
  <script src=
  </script>
</head>
  
<body>
<script type="text/javascript">
  
 // Calling the sourceFromRgb() function over
 // the color values in RGB and RGBA format
 console.log(fabric.Color.sourceFromRgb("rgb(13, 50, 77)"));
 console.log(fabric.Color.sourceFromRgb("rgba(200, 255, 252, 0.6)"));
</script>
  
</body>
  
</html>

Output:

[13,50,77,1]
[200,255,252,0.6]

Example 2:

HTML




<!DOCTYPE html>
<html>
  
<head>
  <!-- Adding the FabricJS library -->
  <script src=
  </script>
</head>
  
<body>
<script type="text/javascript">
  
 // Initializing some color values in RGB format
 var A = "rgb(0, 12, 50)";
 var B = "rgb(254, 200, 110)";
   
 // Initializing some color values in RGBA format
 var C = "rgba(5, 10, 50, 0.9)";
 var D = "rgba(12, 0, 150, 0.2)";
  
 // Calling the sourceFromRgb() function over
 // the above color values
 console.log(fabric.Color.sourceFromRgb(A));
 console.log(fabric.Color.sourceFromRgb(B));
 console.log(fabric.Color.sourceFromRgb(C));
 console.log(fabric.Color.sourceFromRgb(D));
</script>
  
</body>
  
</html>

Output:

[0,12,50,1]
[254,200,110,1]
[5,10,50,0.9]
[12,0,150,0.2]

Hey geek! The constant emerging technologies in the world of web development always keeps the excitement for this subject through the roof. But before you tackle the big projects, we suggest you start by learning the basics. Kickstart your web development journey by learning JS concepts with our JavaScript Course. Now at it’s lowest price ever!




My Personal Notes arrow_drop_up
Recommended Articles
Page :