Text with Two Colors

Text with two colors

Another possible option is to use SVG. You can create multi colored text in SVG using gradients. If two adjacent gradient stops are at the same position then you will get a sharp transition between colors. If two adjacent gradient stops are at different positions then you will get a smooth transition between colors. You can have as many color stops as you want. For example...

<svg width="200" height="80" xmlns="http://www.w3.org/2000/svg">
    <defs>
        <linearGradient id="bicolored">
            <stop offset="33%" stop-color="red"/>
            <stop offset="33%" stop-color="blue"/>
        </linearGradient>
        <linearGradient id="tricolored">
            <stop offset="33%" stop-color="red"/>
            <stop offset="33%" stop-color="green"/>
            <stop offset="66%" stop-color="green"/>
            <stop offset="66%" stop-color="blue"/>
        </linearGradient>
        <linearGradient id="smooth">
            <stop offset="33%" stop-color="red"/>
            <stop offset="66%" stop-color="blue"/>
        </linearGradient>
    </defs>
    <text x="0" y="20" fill="url(#bicolored)">Some bicolored Text</text>
    <text x="0" y="40" fill="url(#tricolored)">Some tricolored Text</text>
    <text x="0" y="60" fill="url(#smooth)">Some smooth gradient Text</text>
</svg>

Note that in SVG, the color stops are at relative positions (e.g. 0 to 1, 0% to 100%). This could make it a little hard if you are trying to place the color stops at specific pixel locations.

Note that in SVG, you have to manually position the text element within the svg element.

Two colors in text in css

Here is a short example of what linear gradient can do

h1 {  font-size: 72px;  background: -webkit-linear-gradient(green, red);  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;}

<h1>The BLA BLA</h1>

How to set different colors in HTML in one statement?

You could use CSS for this and create classes for the elements. So you'd have something like this

p.detail { color:#4C4C4C;font-weight:bold;font-family:Calibri;font-size:20 }
span.name { color:#FF0000;font-weight:bold;font-family:Tahoma;font-size:20 }

Then your HTML would read:

<p class="detail">My Name is: <span class="name">Tintinecute</span> </p>

It's a lot neater then inline stylesheets, is easier to maintain and provides greater reuse.

Here's the complete HTML to demonstrate what I mean:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <style type="text/css">
    p.detail { color:#4C4C4C;font-weight:bold;font-family:Calibri;font-size:20 }
    span.name { color:#FF0000;font-weight:bold;font-family:Tahoma;font-size:20 }
    </style>
</head>
<body>
    <p class="detail">My Name is: <span class="name">Tintinecute</span> </p>
</body>
</html>

You'll see that I have the stylesheet classes in a style tag in the header, and then I only apply those classes in the code such as <p class="detail"> ... </p>. Go through the w3schools tutorial, it will only take a couple of hours and will really turn you around when it comes to styling your HTML elements. If you cut and paste that into an HTML document you can edit the styles and see what effect they have when you open the file in a browser. Experimenting like this is a great way to learn.

how to give two different colors to two different text on a button

Simply use two <span> or <p> for both the text having different class name and add respective color for that class in CSS

$("#btnProduct").html('<span class="red">Production:</span></br></br><span class="blue">55</span>');

and in CSS add styles for .red and .blue

How to print text with multiple different types of colors in he same line in Python 3?

There could be multiple ways to achieve this. One which doesn't require any extra packages is to use ANSI color codes. Look at this link. Below are some examples.

s = "\033[1;32;40m Bright Green on black \033[1;31;43m Red on yellow \033[1;34;42m Blue on green \033[1;37;40m" print(s)

Here in first code \033[1;32;40m, \033[ is the escape code followed by 1 for bold, 32 for bright green text and 40 for black background. The 3 codes are separated by ; and ended with m. Adding all the 3 codes (1, 32 and 40 here) isn't mandatory though.

output:
Sample Image

Other ways to achieve this can be found here.

Two colors in text in css

Here is a short example of what linear gradient can do

h1 {  font-size: 72px;  background: -webkit-linear-gradient(green, red);  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;}

<h1>The BLA BLA</h1>

Single TextView with multiple colored text

yes, if you format the String with html's font-color property then pass it to the method Html.fromHtml(your text here)

String text = "<font color=#cc0029>First Color</font> <font color=#ffcc00>Second Color</font>";
yourtextview.setText(Html.fromHtml(text));

Text with Two Colors