Draw the Ukrainian Flag

Question

As you probably know, there is a war going on in Ukraine. I noticed that it seems nobody has posted a Ukrainian flag challenge yet, so I thought I'd do it myself in support of Ukraine.

The Challenge

Here is the flag:

The flag is divided horizontally across the middle into two equally sized stripes.
Stripe colors: (0, 87, 183) or #0057B7 (blue, top) and (255, 215, 0) or #FFD700 (yellow, bottom).
Colors must be exact if possible, otherwise use the closest available blue and yellow.
The image can be saved to a file or piped raw to STDOUT in any common image file format, or it can be displayed in a window.
The image must be sized at a 3:2 ratio, and at least 78 by 52 pixels.
Alternatively, output a block of text at least 78 characters wide made of non-whitespace characters that depicts the flag, using ANSI color codes to color it. (Use standard blue and yellow.)
Built-in flag images, flag-drawing libraries, or horrendously upscaling the Ukrainian flag emoji are prohibited.

This is code-golf, so shortest code wins!

If the ANSI color code option is chosen, what aspect ratio should we assume each character has? — Nitrodon, Commented Mar 19, 2022 at 16:38
Unless I'm misunderstanding the QBasic answer already posted, I think that answer has inexact colors due to limitations of the language, but it is certainly likely other ancient languages could also have too-limited color-spaces to display the correct colors — des54321, Commented Mar 19, 2022 at 19:42
Related: codegolf.stackexchange.com/questions/230438/create-a-pride-flag — tsh, Commented Mar 20, 2022 at 5:10
Just pointing out that the yellow in the image above is #fbd02a and the blue is #1a54b2, as opposed to the #ffd700 and #0057b7 specified in the text. — Steve Bennett, Commented Mar 21, 2022 at 22:48

badatgolf · Accepted Answer · 2022-03-22 01:15:11Z

5

MSWLogo, I'm assuming 173 167 bytes.

to f :a :b :c :y
setpos(list 0 :y)
setpc(list :a :b :c)
repeat 2[fd 26 rt 90 fd 72 rt 90]
setpos(list 1 :y+1)
setfc(list :a :b :c)
fill
end
f 225 215 0 0 f 0 87 153 26

edited Mar 22, 2022 at 1:15

answered Mar 21, 2022 at 13:39

badatgolf

1,4873 silver badges24 bronze badges

\$\begingroup\$ MSWLego? Didn't know they were doing code golf \$\endgroup\$
– Ginger
Commented Mar 21, 2022 at 15:00
\$\begingroup\$ @Ginger lol. saw a Scratch answer and I just thought to myself: "Let's do this in Logo" \$\endgroup\$
– badatgolf
Commented Mar 22, 2022 at 1:12

Add a comment |

Ismael Miguel · Accepted Answer · 2022-03-23 05:32:40Z

SimpleTemplate 0.84, 102 bytes

This answer outputs a flag with 78x52 characters.

{@fori to51}{@forto77}<b{@ifi is lowerthan26} x{@/}>@{@/}<br>{@/}<style>b{color:#0057B7}[x]{color:gold

This code generates 20474 bytes of pure HTML nightmare, but works!

Ungolfed

The golfed code is pretty hard to read, so, here's an ungolfed version.

{@for i from 0 to 51}
    {@for j from 0 to 77}
        {@echo "<b"}
        {@if i is lower than 26}
            {@echo " x"}
        {@/}
        {@echo ">@"}
    {@/}
    {@echo "<br>"}
{@/}
{@echo "<style>b{color:#0057B7}[x]{color:gold"}

This code behaves exactly the same as the golfed version.

Output

This is a nightmare, but, it outputs the following (lightly edited to work as a StackSnippet):

b{color:#0057B7}[x]{color:gold

<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<b x>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br><b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<b>@<br>

You can try the code here: https://www.ideone.com/xIjh40

des54321 · Accepted Answer · 2022-03-25 18:43:45Z

Node JavaScript 84, 83, 77, 66

83 bytes

f=n=>`\x1b[48;5;${n}m${' '.repeat(78)}\x1b[m
`.repeat(13);console.log(f(33)+f(220))

draws the flag on terminal output, 1 byte saved thanks to @Samathingajig's suggestion to use an inline LF instead of '\n'.

You can try copying and pasting the code after the REPL prompt (brought up by running node in a terminal). Alternatively save the code to file and run it with node filename.

77 bytes

Another 6 bytes saved by replacing each occurence of \x1b (4bytes) with a single ASCII ESC character (1 byte). Due to character set limitations in HTML, you can run the code snippet to see the actual code and length. Save it to file and run with Node to see the flag:

js.value="f=n=>`\x1b[48;5;${n}m${' '.repeat(78)}\x1b[m\n`.repeat(13);console.log(f(33)+f(220))"
console.log("Length=%s", js.value.length);

<textarea id="js" style="width:90%"></textarea>

<!-- Click on Run Code Snippet to see the code-->

Run the 77 byte version as a file:

Raw ANSI color escapes in pasted source appear to be filtered out (sanitized?) before node's REPL prompt echoes or evaluates code, resulting in no flag being drawn.
Ansi 8-bit color codes were used because 24 bit codes were not effective in terminals tested.
Tested in linux terminal and Windows CMD.exe terminal. GitHub's bash terminal for windows used Cyan and Yellow instead of the colors specified.
The 3:2 aspect ratio is approximate and may vary according to the font metrics of the terminal font.

flag.js (66 bytes)

f=h=>`${h[0].repeat(78)}
`.repeat(26)
console.log(f`💙`+f`💛`)

Run from file in node and redirect stdout to a text file
```
  node flag > flag.txt
```
Load the text file in a browser with dark mode selected (preferably).

To preview run the following code snippet (it has an additional line to provide a "console.log" functions to mimic writing to stdout), full screen the snippet window and reduce page zoom as required to make the flag fit within the window.

console.log = s=> document.querySelector('code').textContent+=s;

f=h=>`${h[0].repeat(78)}
`.repeat(26)
console.log(f`💙`+f`💛`)

pre, code{height: 100%; width: 100%; background:black}

<pre><code></code></pre>

You can replace \n with the literal newline character to save 1 byte, since template literals allow for multiline strings — Samathingamajig, Commented Mar 24, 2022 at 0:56
@Samathingamajig Hi - and thanks again. I actually came across that when testing changing \x1b to ESC characters but "fixed" it to go back to \n without realizing it would be valid(LOL). Now at 77 bytes, best... — traktor, Commented Mar 24, 2022 at 1:43
"This now needs to be saved to a file in order to run with Node - the linefeed was not parsed correctly when pasted after the REPL prompt." It works for me when I just paste it. I guess it depends on the terminal/OS (the 83 byte version) — Samathingamajig, Commented Mar 24, 2022 at 2:05
@Samathingamajig Interesting: I've had it error using CMD.exe terminal but it worked when retested. Ming64 terminal (GitHub"s bash terminal for windows) failed once but worked after a retry. I'd say "results may vary" without being sure if it was me or the computer. Both of these terminals (or REPL code) filter out the ANSI color escape sequences from input when pasting the 77 byte code into the terminal, without echoing the sequences on the command line or using them during evaluation. — traktor, Commented Mar 24, 2022 at 3:26

LdBeth · Accepted Answer · 2022-03-27 19:43:30Z

Dyalog APL,55 byte

(⊂'P3 78 52 255 ',⍕,⍉2028/(3⍴256)⊤22455 16766720)∘⎕NPUT

Write a plain text PPM image to provided filename.

$ cat out.ppm
P3 78 52 255 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87
183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87
...
183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87 183 0 87
183 0 87 183 255 215 0 255 215 0 255 215 0 255 215 0 255 215 0 255 215 0
255 215 0 255 215 0 255 215 0 255 215 0 255 215 0 255 215 0 255 215 0
255 215 0 255 215 0 255 215 0 255 215 0 255 215 0 255 215 0 255 215 0
...

chtenb · Accepted Answer · 2022-03-28 07:29:25Z

5

Haskell, 83 81 69 bytes

My first haskell submission.

This code defines a function that prints the flag to stdout using ansi escape codes.

n?s=[1..n]>>s
putStr$"43">>= \c->13?(78?("\27[4"++c:"m \27[m")++"\n")

edited Mar 28, 2022 at 7:29

answered Mar 27, 2022 at 21:57

chtenb

2611 silver badge5 bronze badges

Add a comment |

user111777user111777 · Accepted Answer · 2022-03-31 08:49:16Z

5

PHP Imagick (209 chars)

Draw and output the image to the browser (Imagick is a native PHP extension).
No line break are needed for execution :

header('Content-Type:image/png');
$d=new\ImagickDraw();
$d->setFillColor('#0057B7');
$d->rectangle(0,0,990,330);
$i=new\Imagick();
$i->newImage(990,660,'#FFD700');
$i->setImageFormat('png');
$i->drawImage($d);
echo$i;

answered Mar 31, 2022 at 8:49

user111777

Add a comment |

Mr.McNuggets · Accepted Answer · 2022-04-17 17:43:04Z

5

Python 3, 330 273 bytes

The following piece of code shows the Ukrainian flag in coloured text when executed in the Windows Command Prompt

import sys
from termcolor import *
import os
os.system("")
t=colored("#","blue",attrs=["reverse","blink"])
for x in range(26):
    for x in range(78):
        print(end=t)
    print()
t=colored("#","yellow",attrs=["reverse","blink"])
for x in range(26):
    for x in range(78):
        print(end=t)
    print()

Try It Online is not available, for the reason it wouldn't display the colours.

edited Apr 17, 2022 at 17:43

answered Mar 25, 2022 at 17:27

Mr.McNuggets

916 bronze badges

\$\begingroup\$ Can golf this down to 273 bytes by trimming indent whitespace, using an import*, print(end=t) instead of print(t,end=""), and some smarter iterators because you arent using the value x in the for loops \$\endgroup\$
– des54321
Commented Mar 25, 2022 at 17:47
\$\begingroup\$ When running on linux you can safely remove the os.system("") line \$\endgroup\$
– mousetail
Commented Jun 21, 2022 at 10:39

Add a comment |

cnamejj · Accepted Answer · 2022-05-04 19:40:00Z

Ly, 39 bytes

99*:3*&s*:[r009r,]+[r990r,]+'Po9lf2*f3r

Try it online!

This code pushes RGB values compatible with PPM ASCII formatted image into the stack, then creates a minimum PPM header before exiting. The numbers on the stack are printed automatically when the code exits.

Generate width/height numbers, figure out "half the pixels" count

 99*         - Push "81" on stack (will be 1/2 height, 1/3 width)
    :        - Duplicate top of stack
     3*      - Multiple by 3 (yields width)
       &s    - Save stack to backup (needed later for header)
         *   - Multiple to get "half the pixels"
          :  - Duplicate top of stack

Generate blue pixels, pushed onto the stack

 [      ]+  - Loops one per pixel
  r         - Reverse stack
   009      - Push "0 0 9" onto stack
      r     - Reverse to get pixel count back to top
       ,    - Decrement counter

Generate yellow pixels, pushed onto the stack

 [      ]+  - Loops once per pixel
  r         - Reverse stack
   990      - Push "9 9 0" onto stack
      r     - Reverse to get pixel count back to top
       ,    - Decrement counter

Print PPM header

 'Po          - Print "P"
    9         - Push 9 as "max RGB value"
     l        - Load "width and height" from backup cell
      f       - Flip top two entries (width, height)
       2*     - Double to get the height
         f    - Flip top two entries back
          3   - Push 3, the "PPM image type"
           r  - Reverse stack, stack prints automatically

sehe · Accepted Answer · 2022-05-04 21:57:34Z

5

C++, GCC 227216 chars

Hardly golf considering the language/tools, but still worth a try

#import<boost/gil/extension/io/pnm.hpp>
int n;int main(){boost::gil::rgb8_image_t i{999,666};for_each_pixel(view(i),[](auto&p){n++/999<333?p={0,87,183}:p={255,215,0};});write_view("U",view(i),boost::gil::pnm_tag{});}

It's not even obfuscated if reformatted:

#import <boost/gil/extension/io/pnm.hpp>
int n;
int main() {
    boost::gil::rgb8_image_t i{999, 666};
    for_each_pixel(view(i), [](auto& p) {
        n++ / 999 < 333 ? p = {0, 87, 183} : p = {255, 215, 0};
    });
    write_view("U", view(i), boost::gil::pnm_tag{});
}

The U file is in PNM format, meaning no link dependencies. Built with GCC-10 results in 19K binary.

Live On Compiler Explorer

Resulting file:

U: Netpbm image data, size = 999 x 666, rawbits, pixmap

edited May 4, 2022 at 21:57

answered Mar 22, 2022 at 20:21

sehe

4102 silver badges9 bronze badges

1

\$\begingroup\$ 216 bytes \$\endgroup\$
– gastropner
Commented May 4, 2022 at 21:34
\$\begingroup\$ @gastropner Hah. Who'dve-thunk that you can simply #import header files :) Also, nice with the ternary around the assignment expression. \$\endgroup\$
– sehe
Commented May 4, 2022 at 21:54

Add a comment |

Ohentis · Accepted Answer · 2022-05-09 02:19:19Z

5

Applesoft Basic, 88 bytes

1Y=0
2M=13
3GR
4COLOR=2
5HLIN0,38ATY
6Y=Y+1
7IFY<M GOTO5
8COLOR=13
9M=26
10Y=13
11GOTO5

Kind of cheating because it only is 39:26. I don't know if this is actually valid but it works here. A high res but worse color answer for 93 bytes:

1Y=0
2M=26
3HGR
4HCOLOR=6
5HPLOT0,Y TO78,Y
6Y=Y+1
7IFY<M GOTO5
8HCOLOR=5
9M=52
10Y=26
11GOTO5

answered May 9, 2022 at 2:19

Ohentis

2211 silver badge3 bronze badges

Add a comment |

Dom Hastings · Accepted Answer · 2022-05-11 11:47:57Z

5

Perl 5, 36 bytes

$#a=78;print".[${_}m@a
"x13for 44,43

Try it online!

Outputs using ANSI escape sequences.

answered May 11, 2022 at 11:47

Dom Hastings

24.3k4 gold badges55 silver badges92 bronze badges

\$\begingroup\$ For some reason, the link seems to show an 'L'-shaped flag with a long extension at the bottom right. Is this just a side-effect of the 'code sandbox'? \$\endgroup\$
– Dominic van Essen
Commented May 11, 2022 at 12:58
\$\begingroup\$ @DominicvanEssen Yeah, it's a side effect of ANSI escape codes being used in a window that's not long enough for the content, the same happens in a local terminal if you're most of the way down. It's annoying. I did briefly look at auto-sizing STDOUT for code-sandbox, but it would need to be resized before the content makes it there... \$\endgroup\$
– Dom Hastings
Commented May 11, 2022 at 14:44
\$\begingroup\$ @DominicvanEssen Thanks for the nudge, I've just made a fix so that the xterm window will resize on input (not sure how quickly the cache is invalidated on GitHub pages, but thanks again for the prompt!) \$\endgroup\$
– Dom Hastings
Commented May 11, 2022 at 19:53
\$\begingroup\$ Works perfectly now. Nice one. \$\endgroup\$
– Dominic van Essen
Commented May 11, 2022 at 20:50

Add a comment |

Alice F · Accepted Answer · 2022-06-19 13:29:04Z

5

BBC BASIC, 72 bytes

V. 19,0,16,255,215|25,97,78;26;25,4,78;27;19,0,16,0,87,183;25,97,-78;26;

Output

answered Jun 19, 2022 at 13:29

Alice F

3973 silver badges10 bronze badges

Add a comment |

mousetail · Accepted Answer · 2022-06-21 11:18:17Z

5

Python + Pygame (122 bytes)

import pygame.display as p
s=p.set_mode((78,52))
s.fill((0,87,183),(0,0,78,26))
s.fill((255,215,0),(0,26,78,26))
p.flip()

Briefly flashes the flag on the screen before exiting.

answered Jun 21, 2022 at 11:18

mousetail

13k1 gold badge37 silver badges83 bronze badges

Add a comment |

Narek Torosyan · Accepted Answer · 2022-07-08 15:20:55Z

C# (.NET Framework), 163 chars

Shorter version of Björn Larsson's answer.

void Draw(){var f=new Bitmap(78,52);for(int y=0;y<52;y++)for(int x=0;x<78;x++)f.SetPixel(x,y,Color.FromArgb(y>25?255:0,y>25?215:87,y>25?0:183));f.Save("f.bmp");}

Effective version with explanation:

using System.Drawing;

namespace Ukraine {
    internal class Program {
        static void Main() {
            // Create a bitmap.
            var f = new Bitmap(78, 52);

            // Iterate over the bitmap's pixels.
            for (int y = 0; y < 52; y++) {
                for (int x = 0; x < 78; x++) {
                    f.SetPixel(                  // Set the pixel...
                        x, y,                    // at the current x and y...
                        Color.FromArgb(
                            y > 25 ? 255 : 0,    // selecting the R value with a ternary expression...
                            y > 25 ? 215 : 87,   // selecting the G value with a ternary expression...
                            y > 25 ? 0 : 183)    // and selecting the B value with a ternary expression.
                        );
                }
            }

            // Save the bitmap.
            f.Save("f.bmp");
        }
    }
}

Produces an image in the exe's folder:

Welcome to Code Golf! One thing to note is that snippets are not allowed by our rules, so you would have to wrap this in a full program (all the Main stuff and whatnot). — Seggan, Commented Jul 7, 2022 at 16:27

Eric Xue · Accepted Answer · 2022-07-19 21:07:03Z

5

SVG, 132 bytes

<svg width="300"height="200"><rect width="300"height="100"fill="#0057b7"/><rect y="100"width="300"height="100"fill="#ffd700"/></svg>

answered Jul 19, 2022 at 21:07

Eric Xue

4604 silver badges7 bronze badges

Add a comment |

Leaf · Accepted Answer · 2022-08-03 12:24:34Z

5

JavaScript (Node.js), 94 bytes

Prints a solid flag (or not quite, depending on your font) in the specified rgb colors.

for(i=1;i<4108;i++)process.stdout.write(i%79?`\x1b[38;2;${i<2054?'0;87;183':'255;215;0'}m█`:`
`)

answered Aug 3, 2022 at 12:24

Leaf

5014 silver badges6 bronze badges

Add a comment |

autumn · Accepted Answer · 2022-09-25 03:27:32Z

5

WP2, 32 bytes

VWtsR1JpSUFBQUJYUlVKUVZsQTRUQlVBQUFBdlRjQU1BQkNRSkVQYjNUUmgvbWUzLzVuVUgvVUEK

WP2 (WebP2) is an image format based on AVIF. It's state-of-the-art in the field of DCT-based image formats, as far as I'm aware. It's also really good at lossless compression.

Encoded in Base64 RFC4648

answered Sep 25, 2022 at 3:27

autumn

6627 silver badges13 bronze badges

Add a comment |

numbertheory · Accepted Answer · 2022-09-25 18:24:46Z

5

Ruby + paint, 73 bytes

You do need the paint gem installed, from rubygems: gem install paint

Update:

Thanks to manatwork for the much shorter:

require'paint';['#0057b7','#ffd700'].map{|c|5.times{puts Paint[?█*37,c]}}

Original attempt (127 bytes):

require'paint';c=['#0057b7','#ffd700'];(0..1).each do |i|;(0..4).each do;(0..36).each do;print Paint['█',c[i]];end;puts;end;end

edited Sep 25, 2022 at 18:24

answered Sep 25, 2022 at 10:27

numbertheory

1011 silver badge3 bronze badges

2

\$\begingroup\$ Nice try, but not really matches the goal of code-golf challenges. May I suggest the mostly equivalent require'paint';['#0057b7','#ffd700'].map{|c|5.times{puts Paint[?█*37,c]}}? \$\endgroup\$
– manatwork
Commented Sep 25, 2022 at 12:14
\$\begingroup\$ Thanks @manatwork! I haven't used Ruby in a bit, but that's much shorter. \$\endgroup\$
– numbertheory
Commented Sep 25, 2022 at 18:26
1

\$\begingroup\$ You can use a word array to save 2 bytes require'paint';%w(#0057b7 #ffd700).map{|c|5.times{puts Paint[?█*37,c]}} \$\endgroup\$
– south
Commented Oct 4, 2022 at 23:31

Add a comment |

manatwork · Accepted Answer · 2022-10-04 19:11:45Z

5

Ruby with Shoes, 96 characters

Shoes.app(width:78,height:52){background rgb 0,87,183
stroke fill rgb 255,215,0
rect 0,26,78,52}

Sample output:

flag of Ukraina

answered Oct 4, 2022 at 19:11

manatwork

20.6k5 gold badges51 silver badges81 bronze badges

Add a comment |

joyoforigami · Accepted Answer · 2022-12-27 18:03:53Z

5

Python (Thonny 4.0 REPL), 419 bytes

print("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARMAAAC3CAMAAAAGjUrGAAAAD1BMVEUAW7v/1QAAVb+ln3n/2QAG3wIgAAAAzUlEQVR4nO3QsQGAMAzAsBT4/2b2eO0onaAZAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACASx62ednmY5vD5qSclJNyUk7KSTkpJ+WknJSTclJOykk5KSflpJyUk3JSTspJOSkn5aSclJNyUk7KSTkpJ+WknJSTclJOykk5KSflpJyUk3JSTspJOSkn5aSclJNyUk7KSTkpJ+WknJSTclJOykk5KSflpJyUk3JSTspJOSkn5aSclJNyUk7KSTkpJ+WknJSTclJOykk5KSflpH7zk2pa0LCuDAAAAABJRU5ErkJggg==")

Longer than a standard answer but ok. Thonny supports printing images if they’re in base64 form.

edited Dec 27, 2022 at 18:03

answered Dec 26, 2022 at 20:20

joyoforigami

7214 silver badges14 bronze badges

\$\begingroup\$ Your first answer is valid, if a little long (although I'd change the title to something like "Python 3 (Thonny REPL), 419 bytes"; your second answer isn't valid as it's not actually a program which outputs the image. (And the image isn't correctly formatted anyway.) \$\endgroup\$
– Ginger
Commented Dec 27, 2022 at 17:10

Add a comment |

roblogic · Accepted Answer · 2023-09-04 11:59:48Z

5

Chipmunk BASIC, 116 bytes

Chipmunk Basic v368b2.02 on MacOS. This fun wee lang adjusts RGB values by a factor0.392157.

graphics 0
graphics color 0,34,72
graphics fillrect 0,0,132,44
graphics color 100,84,0
graphics fillrect 0,44,132,88

answered Sep 4, 2023 at 11:59

roblogic

3,33217 silver badges17 bronze badges

Add a comment |

vengy · Accepted Answer · 2024-03-21 20:05:11Z

4

SVG - Scalable Vector Graphics. 151 bytes

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3 2"><path d="M0 0H3V1H0ZM0 1H3V2H0Z" fill="#005BBB"/><path d="M0 1H3V2H0Z" fill="#FFD500"/></svg>

Try it online

edited Mar 21 at 20:05

answered Mar 21 at 16:29

vengy

2,2796 silver badges30 bronze badges

Add a comment |

cnln · Accepted Answer · 2024-04-15 19:34:10Z

4

Python 3, 152 bytes

A repurposing of my answer to the Pride flag challenge, with some small improvements to the visuals.

from curses import*
s=initscr();start_color();y=1
for x in[12,11,0]:w=newwin(13,78,~-y*13,0);init_pair(y,1,x);w.bkgd(' ',color_pair(y));w.refresh();y+=1

answered Apr 15 at 19:34

cnln

1114 bronze badges

Add a comment |

Andrew Bayly · Accepted Answer · 2024-07-31 02:38:03Z

4

JavaScript (Node.js), 76 74 bytes

for(i=o=[];i<2400;i++)o+=i%60?[...'🟦🟨'][i/1200|0]:`
`;console.log(o)

Try it online!

edited Jul 31 at 2:38

answered Jul 30 at 19:47

Andrew Bayly

1,1092 silver badges5 bronze badges

Add a comment |

int 21h Glory to Ukraine · Accepted Answer · 2024-08-01 07:44:14Z

4

Actionscript 3, 94 89 bytes

Here comes our national flag in Actionscript and this is my first submission in this language, since my usual languages have been already taken. The code throws an error, but it will compile a SWF (a "swiff") anyway. I took the inspiration from a similar answer to another challenge.

spared 5 bytes by replacing hexadecimal 0xe0057B7 for 22455 and 0xeffd700 for 16766720.

var g=graphics,f=g.beginFill,r=g.drawRect
f(22455);r(0,0,99,33)
f(16766720);r(0,33,99,33)

Glory to Ukraine!

edited Aug 1 at 7:44

answered Mar 21 at 9:24

int 21h Glory to Ukraine

2,3662 gold badges9 silver badges15 bronze badges

5

\$\begingroup\$ Glory to Ukraine indeed! 🇺🇦 \$\endgroup\$
– The Empty String Photographer
Commented Apr 17 at 11:47
5

\$\begingroup\$ @The Empty String Photographer the usual response is "Heroiam Slava!" / "Glory to the heroes!" \$\endgroup\$
– int 21h Glory to Ukraine
Commented Apr 17 at 12:06

Add a comment |

emanresu A · Accepted Answer · 2024-09-04 09:36:49Z

Vyxal `Ḣs`, 33 bytes

»ƛ∨ɖoʀĊ∩»H½4εfƛ`<¦₴ «⟇=øḢ-÷¥:#Π>.

Try it Online! The aspect ratio is a little weird and subject to Vyxal's default window sizing, but this is pretty much 3:2. You can fiddle with the 4 to change the height.

»...»H½                       # Compressed integer converted to hexadecimal and cut in half - FFD700 and 0057B7
       4εf                    # Repeat each four times
          ƛ                   # Format each into 
           `<¦₴ «⟇=øḢ-÷¥:#Π>. # Compressed string "<div style=background-color:#%>."
                              # (s flag) concatenate
                              # (Ḣ flag) render as HTML

int 21h Glory to Ukraine · Accepted Answer · 2024-04-15 16:14:44Z

1

JSL (JMP Scripting Language), 110 bytes

NewWindow("",Graph(FillColor({1,43/51,0});Rect(0,33,99,66,1);FillColor({0,29/85,183/255});Rect(0,66,99,99,1)))

answered Apr 15 at 16:14

int 21h Glory to Ukraine

2,3662 gold badges9 silver badges15 bronze badges

Add a comment |

Stack Exchange Network

Draw the Ukrainian Flag

The Challenge

87 Answers 87

MSWLogo, I'm assuming 173 167 bytes.

SimpleTemplate 0.84, 102 bytes

Ungolfed

Output

Node JavaScript 84, 83, 77, 66

Dyalog APL,55 byte

Haskell, 83 81 69 bytes

PHP Imagick (209 chars)

Python 3, 330 273 bytes

Ly, 39 bytes

C++, GCC 227216 chars

Applesoft Basic, 88 bytes

Perl 5, 36 bytes

BBC BASIC, 72 bytes

Output

Python + Pygame (122 bytes)

C# (.NET Framework), 163 chars

JavaScript (Node.js), 94 bytes

WP2, 32 bytes

Ruby + paint, 73 bytes

Ruby with Shoes, 96 characters

Python (Thonny 4.0 REPL), 419 bytes

Chipmunk BASIC, 116 bytes

SVG - Scalable Vector Graphics. 151 bytes

Python 3, 152 bytes

JavaScript (Node.js), 76 74 bytes

Actionscript 3, 94 89 bytes

Vyxal `Ḣs`, 33 bytes

JSL (JMP Scripting Language), 110 bytes

Your Answer

Not the answer you're looking for? Browse other questions tagged
code-golf
kolmogorov-complexity
graphical-output
or ask your own question.

Linked

Hot Network Questions

Draw the Ukrainian Flag

The Challenge

87 Answers 87

MSWLogo, I'm assuming 173 167 bytes.

SimpleTemplate 0.84, 102 bytes

Ungolfed

Output

Node JavaScript 84, 83, 77, 66

Dyalog APL,55 byte

Haskell, 83 81 69 bytes

PHP Imagick (209 chars)

Python 3, 330 273 bytes

Ly, 39 bytes

C++, GCC 227216 chars

Applesoft Basic, 88 bytes

Perl 5, 36 bytes

BBC BASIC, 72 bytes

Output

Python + Pygame (122 bytes)

C# (.NET Framework), 163 chars

JavaScript (Node.js), 94 bytes

WP2, 32 bytes

Ruby + paint, 73 bytes

Ruby with Shoes, 96 characters

Python (Thonny 4.0 REPL), 419 bytes

Chipmunk BASIC, 116 bytes

SVG - Scalable Vector Graphics. 151 bytes

Python 3, 152 bytes

JavaScript (Node.js), 76 74 bytes

Actionscript 3, 94 89 bytes

Vyxal Ḣs, 33 bytes

JSL (JMP Scripting Language), 110 bytes

Your Answer

Sign up or log in

Post as a guest

Not the answer you're looking for? Browse other questions tagged code-golfkolmogorov-complexitygraphical-output or ask your own question.

Linked

Related

Hot Network Questions

Vyxal `Ḣs`, 33 bytes

Not the answer you're looking for? Browse other questions tagged
code-golf
kolmogorov-complexity
graphical-output
or ask your own question.