Draw the national flag of France

Question

There have been many other flag challenges posted but not one for the national flag of France. This week seems like an appropriate time.

Produce this flag in the fewest bytes possible:

• The image must be in a ratio of 3:2, with size at least 78 pixels wide and 52 pixels tall.
• Each stripe takes up one third of the width.
• The stripe colors from left to right are RGB: (0, 85, 164), (255, 255, 255), (239, 65, 53).
• The image can be saved to a file or piped raw to STDOUT in any common image file format, or it can be displayed.
• 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, white, and red.)
• Built-in flag images/libraries are not allowed.

The shortest code in bytes wins.

Leaderboard

The Stack Snippet at the bottom of this post generates the leaderboard from the answers a) as a list of shortest solution per language and b) as an overall leaderboard.

To make sure that your answer shows up, please start your answer with a headline, using the following Markdown template:

## Language Name, N bytes

where N is the size of your submission. If you improve your score, you can keep old scores in the headline, by striking them through. For instance:

## Ruby, <s>104</s> <s>101</s> 96 bytes

If there you want to include multiple numbers in your header (e.g. because your score is the sum of two files or you want to list interpreter flag penalties separately), make sure that the actual score is the last number in the header:

## Perl, 43 + 2 (-p flag) = 45 bytes

You can also make the language name a link which will then show up in the snippet:

## [><>](http://esolangs.org/wiki/Fish), 121 bytes

<style>body { text-align: left !important} #answer-list { padding: 10px; width: 290px; float: left; } #language-list { padding: 10px; width: 290px; float: left; } table thead { font-weight: bold; } table td { padding: 5px; }</style><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="//cdn.sstatic.net/codegolf/all.css?v=83c949450c8b"> <div id="language-list"> <h2>Shortest Solution by Language</h2> <table class="language-list"> <thead> <tr><td>Language</td><td>User</td><td>Score</td></tr> </thead> <tbody id="languages"> </tbody> </table> </div> <div id="answer-list"> <h2>Leaderboard</h2> <table class="answer-list"> <thead> <tr><td></td><td>Author</td><td>Language</td><td>Size</td></tr> </thead> <tbody id="answers"> </tbody> </table> </div> <table style="display: none"> <tbody id="answer-template"> <tr><td>{{PLACE}}</td><td>{{NAME}}</td><td>{{LANGUAGE}}</td><td>{{SIZE}}</td><td><a href="{{LINK}}">Link</a></td></tr> </tbody> </table> <table style="display: none"> <tbody id="language-template"> <tr><td>{{LANGUAGE}}</td><td>{{NAME}}</td><td>{{SIZE}}</td><td><a href="{{LINK}}">Link</a></td></tr> </tbody> </table><script>var QUESTION_ID = 64140; var ANSWER_FILTER = "!t)IWYnsLAZle2tQ3KqrVveCRJfxcRLe"; var COMMENT_FILTER = "!)Q2B_A2kjfAiU78X(md6BoYk"; var OVERRIDE_USER = 42156; var answers = [], answers_hash, answer_ids, answer_page = 1, more_answers = true, comment_page; function answersUrl(index) { return "https://api.stackexchange.com/2.2/questions/" + QUESTION_ID + "/answers?page=" + index + "&pagesize=100&order=desc&sort=creation&site=codegolf&filter=" + ANSWER_FILTER; } function commentUrl(index, answers) { return "https://api.stackexchange.com/2.2/answers/" + answers.join(';') + "/comments?page=" + index + "&pagesize=100&order=desc&sort=creation&site=codegolf&filter=" + COMMENT_FILTER; } function getAnswers() { jQuery.ajax({ url: answersUrl(answer_page++), method: "get", dataType: "jsonp", crossDomain: true, success: function (data) { answers.push.apply(answers, data.items); answers_hash = []; answer_ids = []; data.items.forEach(function(a) { a.comments = []; var id = +a.share_link.match(/\d+/); answer_ids.push(id); answers_hash[id] = a; }); if (!data.has_more) more_answers = false; comment_page = 1; getComments(); } }); } function getComments() { jQuery.ajax({ url: commentUrl(comment_page++, answer_ids), method: "get", dataType: "jsonp", crossDomain: true, success: function (data) { data.items.forEach(function(c) { if (c.owner.user_id === OVERRIDE_USER) answers_hash[c.post_id].comments.push(c); }); if (data.has_more) getComments(); else if (more_answers) getAnswers(); else process(); } }); } getAnswers(); var SCORE_REG = /<h\d>\s*([^\n,<]*(?:<(?:[^\n>]*>[^\n<]*<\/[^\n>]*>)[^\n,<]*)*),.*?(\d+)(?=[^\n\d<>]*(?:<(?:s>[^\n<>]*<\/s>|[^\n<>]+>)[^\n\d<>]*)*<\/h\d>)/; var OVERRIDE_REG = /^Override\s*header:\s*/i; function getAuthorName(a) { return a.owner.display_name; } function process() { var valid = []; answers.forEach(function(a) { var body = a.body; a.comments.forEach(function(c) { if(OVERRIDE_REG.test(c.body)) body = '<h1>' + c.body.replace(OVERRIDE_REG, '') + '</h1>'; }); var match = body.match(SCORE_REG); if (match) valid.push({ user: getAuthorName(a), size: +match[2], language: match[1], link: a.share_link, }); else console.log(body); }); valid.sort(function (a, b) { var aB = a.size, bB = b.size; return aB - bB }); var languages = {}; var place = 1; var lastSize = null; var lastPlace = 1; valid.forEach(function (a) { if (a.size != lastSize) lastPlace = place; lastSize = a.size; ++place; var answer = jQuery("#answer-template").html(); answer = answer.replace("{{PLACE}}", lastPlace + ".") .replace("{{NAME}}", a.user) .replace("{{LANGUAGE}}", a.language) .replace("{{SIZE}}", a.size) .replace("{{LINK}}", a.link); answer = jQuery(answer); jQuery("#answers").append(answer); var lang = a.language; lang = jQuery('<a>'+lang+'</a>').text(); languages[lang] = languages[lang] || {lang: a.language, lang_raw: lang.toLowerCase(), user: a.user, size: a.size, link: a.link}; }); var langs = []; for (var lang in languages) if (languages.hasOwnProperty(lang)) langs.push(languages[lang]); langs.sort(function (a, b) { if (a.lang_raw > b.lang_raw) return 1; if (a.lang_raw < b.lang_raw) return -1; return 0; }); for (var i = 0; i < langs.length; ++i) { var language = jQuery("#language-template").html(); var lang = langs[i]; language = language.replace("{{LANGUAGE}}", lang.lang) .replace("{{NAME}}", lang.user) .replace("{{SIZE}}", lang.size) .replace("{{LINK}}", lang.link); language = jQuery(language); jQuery("#languages").append(language); } }</script>

Answer 1

Pure Bash (on OSX), 84

The default OSX terminal supports full colour emojis. Not sure if this counts as text or graphical output.

printf -vs %26s
for i in {1..26}
do echo ${s// /🔵}${s// /⚪️}${s// /🔴}
done

Output looks like:

---

Alternatively:

Bash with OSX utilities, 56

yes `dc -e3do26^d1-dn2/*p|tr 201 🔵🔴⚪️`|sed 26q

The dc expression:

• calculates 3^26-1 and prints it in ternary 22222222222222222222222222
• divides this by 2, then multiplies by 3^26. Output in ternary this is 1111111111111111111111111100000000000000000000000000

tr then translates the 210 characters to 🔵⚪️🔴. yes outputs this line indefinitely. sed 26q halts output at 26 lines.

Answer 2

Desmos, 30 12 bytes

3x>10
3x<-10

Try it online.

_{I'm not entirely sure if this is valid, please let me know if there are any issues.}

Answer 3

Python 2, 47 bytes

s="[3%smF";print(s%4*26+s%7*26+s%1*26+"\n")*30

Contains unprintables - here's a hexdump (reversible with xxd -r):

00000000: 733d 221b 5b33 2573 3b31 6d46 223b 7072  s=".[3%s;1mF";pr
00000010: 696e 7428 7325 342a 3236 2b73 2537 2a32  int(s%4*26+s%7*2
00000020: 362b 7325 312a 3236 2b22 5c6e 2229 2a33  6+s%1*26+"\n")*3
00000030: 30                                       0

Uses ANSI escape codes to print colored characters to STDOUT - I chose "F" for France. No online link because ideone doesn't support ANSI escape codes in output.

Thanks to Dennis and xnor for some great tips.

Screenshot from xterm:

Answer 4

HTML / SVG, 76 bytes 87 88 121 122 149

Saved 27 bytes thanks to @insertusernamehere

Saves 9 bytes thanks to @Joey

Saved 1 bytes thanks to @sanchies

Saves 1 bytes thanks to @Neil

<svg><path fill=#0055a4 d=m0,0h26v52H0 /><path fill=#ef4135 d=M52,0h26v52H52

Using lots of HTML syntax abuse, this can get pretty short.

---

Screenshot of output:

---

Or try it (make sure your browser supports SVG):

<svg><path fill=#0055a4 d=m0,0h26v52H0 /><path fill=#ef4135 d=M52,0h26v52H52

Answer 5

CJam, 23 22 bytes

00000000: 27 9b 22 5c 22 25 1f 22 66 7b 69 27 6d 32 37 2a  '."\"%."f{i'm27*
00000010: 7d 4e 5d 32 36 2a                                }N]26*

The above is a hexdump that can be reversed with xxd -r.

At the cost of two extra bytes – for a total of 24 bytes – we can use background colors instead, making the output a bit prettier.

00000000: 27 9b 22 2c 2f 29 00 22 66 7b 69 27 6d 53 32 36  '.",/)."f{i'mS26
00000010: 2a 7d 57 4e 74 32 36 2a                          *}WNt26*

How it works

In both programs, we use the ANSI escape sequence \x9bXYm – where X is 3 for foreground color and 4 for background color, and Y specifies the color to use – to switch between the three colors of the flag.

'<CSI>       Push the '\x9b' character (Control Sequence Introducer).
"\"%<US>"    Push the string of the ISO 8859-1 characters with code
             points 34, 37, and 31.
f{           For each character in the string, push the CSI and that
             character; then:
  i            Cast the character to integer.
  'm27*        Push 27 m's. The first completes the control sequence,
               the remaining 26 will be printed.
}
N]           Wrap the generated array and "\n" in an array.
26*          Repeat it 26 times.

The other program is similar.

Output

Answer 6

Brainfuck$, 153 bytes

+++++++++++++[->>>++>+++++++>++++>>>>++++++++>+++<<<<<<<<<<]>>>+>>#->$#>$#+++++++>$--->+++++[<]<<+++++[->+++++>++++++<<]>+#>($#([-]>[.>]<[<])>>>>+++<<<<)

Outputs the image with ANSI color codes. I chose a height of 30 like Mego.

The reference implementation from 2009 linked on the esolangs page has gone missing. You can run it using this interpreter made by me, which supports everything from the esolangs page.

window.addEventListener("load",function(){document.querySelector("#r").addEventListener("click",function(){var  c=document.querySelector("#c").value,u=document.querySelector("#i").value,d=Array(30000).fill(0),p=0,i=0,q=0,s=[],o=document.querySelector("#o");o.value="";eval(c.replace(/[^]/g,function(e,i){return{"+":"d[p]=(-~d[p]+256)%256;","-":"d[p]=(~-d[p]+256)%256;",">":"p++;","<":"p--;",",":"d[p]=q-u.length?u[q++].charCodeAt()%256:0;",".":"o.value+=String.fromCharCode(d[p]);","[":"while(d[p]){","]":"}","#":"s.push(d[p]);","$":"d[p]=s.pop();",";":"d[p]=(parseInt(prompt())%256+256)%256;",":":"o.value+=d[p].toString();","(":"for(var i"+i+"=d[p];i"+i+">0;i"+i+"--){",")":"}","@":"o.value+=('D '+d.slice(0,20)+'\\nS '+s+'\\nIP '+i+' DP '+p);"}[e]||"";}));});});

<label for=c>Code:</label><br/><textarea style="width:100%;height:15em;white-space:pre" id=c>+++++++++++++[-&gt;&gt;&gt;++&gt;+++++++&gt;++++&gt;&gt;&gt;&gt;++++++++&gt;+++&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;]&gt;&gt;&gt;+&gt;&gt;#-&gt;$#&gt;$#+++++++&gt;$---&gt;+++++[&lt;]&lt;&lt; init sequence to cells 3 to 10&#10;+++++[-&gt;+++++&gt;++++++&lt;&lt;] set cells 1~2 to 25 &amp; 30&#10;&gt;+ set cell 1 to 26&#10;# push 26 to stack&#10;&gt; go to cell 2&#10;( do 30 times&#10;    $# get 26 to this cell from stack&#10;    ( do 26 times&#10;        [-]&gt;[.&gt;]&lt;[&lt;] print sequence&#10;    )&#10;    &gt;&gt;&gt;&gt;+++&lt;&lt;&lt;&lt; change color to white&#10;    $# get 26 to this cell from stack&#10;    ( do 26 times&#10;        [-]&gt;[.&gt;]&lt;[&lt;] print sequence&#10;    )&#10;    &gt;&gt;&gt;&gt;------&lt;&lt;&lt;&lt; change color to red&#10;    $# get 26 to this cell from stack&#10;    ( do 26 times&#10;        [-]&gt;[.&gt;]&lt;[&lt;] print sequence&#10;    )&#10;    &gt;&gt;&gt;&gt;+++&lt;&lt;&lt;&lt; change color to blue&#10;    ++++++++++. print newline&#10;)</textarea><br/><button id=r>Run</button><br/><label for=i>Input:</label><br/><textarea id=i style="width:100%"></textarea><br/><label for=o>Output:</label><br/><textarea readonly id=o style="width:100%;height:15em;white-space:pre"></textarea>

Brainfuck, 258 bytes

This is basically the same thing, but just in plain old Brainfuck.

>>+++++++++++++[-<<++>>>>++>+++++++>++++>++++>+++++>++++>++++++++>+++[<]<]>>+>>->>------>--->+++++[<]<<<++++[>+++++[->+++++<]>+[>>[.>]<[<]<-]>>>>>+++[<]+++++[-<+++++>]<+[>>[.>]<[<]<-]>>>>>------[<]+++++[-<+++++>]<+[>>[.>]<[<]<-]>>>>>+++[<]<++++++++++.[-]<<-]

Or, if you prefer this one in oOo CODE (984 bytes):

one day ThERe WIlL Be PEaCE iN ThIS wORlD
OnE DaY ThERe WiLl Be peaCe iN ThIS wOrld
one day theRe WIlL be pEaCE iN ThIS wORlD
OnE DaY theRe WIlL Be PEaCe in ThIS wORlD
OnE day ThERe WIlL Be PEaCe in ThIS wORlD
OnE day ThERe WIlL Be PEaCE iN ThIS wOrld
OnE DaY ThErE wilL bE PeaCe IN this woRlD
one day There will Be pEacE in ThiS woRld
one Day TheRe will Be PEaCE iN ThIS wOrLd
onE dAY thEre WilL Be PEaCE iN ThIs World
OnE DaY ThERe WIlL bE pEace in ThIS wORlD
OnE DaY thErE Will Be PeAce in this WoRLd
one dAY thErE wilL bE PeaCE in tHIs world
one day theRe WIlL Be PeAce iN tHIS wORlD
OnE DaY ThErE wIll be PEaCE iN ThIS wORlD
one dAY thERe WiLl be peace In THis worLD
onE dAy thErE WilL Be peACe in this world
one Day TheRe wIll Be pEace In thIs WORlD
OnE DaY ThERe WiLl Be peaCE iN ThIS wORlD
OnE day tHEre WIlL bE peace in tHiS World
oNE daY tHere WiLL be PEace IN this world
one day ThERe WIlL bE peaCe IN thIS wORlD
OnE DaY ThERe WIlL Be PEaCE iN THis WoRld
oNE daY thERe wiLL

Answer 7

LaTeX, 139 bytes

Thanks to @WChargin for saving 21 bytes.

\documentclass{proc}\input color\begin{document}\def\z#1!{{\color[rgb]{#1}\rule{4cm}{8cm}}}\z0,.33,.64!\z1,‌​1,1!\z.94,.25,.21!\end{document}

This prints the following 12cm*8cm image on an A4 page:

Note that "Page 1" is also printed at the bottom of the page

Answer 8

Pyth, 27 bytes

 .w*52[smmdGc3CM"\0U¤ÿÿÿïA5

There are some unprintable chars, so here's a hexdump:

00000000   2E 77 2A 35  32 5B 73 6D  6D 64 47 63  33 43 4D 22  .w*52[smmdGc3CM"
00000010   5C 30 55 A4  FF FF FF EF  41 35                     \0U.....A5

This creates a file o.png, which is exactly 78 pixels wide and 52 pixels tall:

Explanation:

.w*52[smmdGc3CM"........
               "........  a string containing the bytes 
                          0, 85, 164, 255, 255, 255, 239, 65, 53
             CM           convert them to integers
           c3             split into 3 lists
      smmdG               duplicate each list 26 times
     [                    put them into a list
  *52                     and duplicate it 52 times
.w                        save it as an image o.png

Answer 9

Bash + ImageMagick, 60 77 73 bytes

convert -sample 78x52\! - a<<<"P3 3 1 255 0 85 164 255 255 255 239 65 53"

(ugh, +17 chars due to color requirements I didn't notice earlier...)

Outputs to the file a, in netpbm format:

llama@llama:~$ convert -sample 78x52\! - a<<<"P3 3 1 255 0 85 164 255 255 255 239 65 53"
llama@llama:~$ file a
a: Netpbm image data, size = 78 x 52, rawbits, pixmap

Can also output in PNG, if you change the filename to a.png (+4 chars).

Output:

Answer 10

HTML (quirks mode), 68 bytes

This uses quirks mode to render the flag.

The HTML is VERY invalid, but works on a stock Android 4.4.2 browser and on Firefox 42.0 (on Windows 7 x64).

<table width=78 height=52><td bgcolor=0055a4><td><td bgcolor=ef4135>

The flag is rendered with the right size and the standard red and blue colors. All webpages start with a standard white background.

---

---

As an alternative:

A perfectly valid HTML5 version (141 bytes):

<!DOCTYPE html><title>x</title><table style=width:78px;height:52px><tr><td style=background:#0055a4><td><td style=background:#ef4135></table>

Check it's validity on: https://html5.validator.nu/

Print-screen of the result:

Answer 11

ffmpeg, 110 113 116 117 119 108 100 bytes

Display, using ffplay, 100 bytes:

ffplay -f lavfi color=#0055a4:49x98[r];color=white:49x98[w];color=#ef4135:49x98[b];[r][w][b]hstack=3

Saved to file, using ffmpeg, 108 bytes:

ffmpeg -lavfi color=#0055a4:49x98[r];color=white:49x98[w];color=#ef4135:49x98[b];[r][w][b]hstack=3 -t 1 .png

The current version of the command will abort with an error BUT will output a single image ".png", same as shown below.

Answer 12

CSS, 127 128 144 bytes

body:before,body:after{content:'';float:left;width:33%;height:100%;background:#0055a4}body:after{float:right;background:#ef4135}

No need for another tag, works solely with the body-element.

Edits

• Saved 16 bytes by removing display:block; and some ;.
• Saved 1 byte, removed the trailing }.

Answer 13

TI-Basic, 52 44 42 bytes

GridOff
AxesOff
11
Shade(-Ans,Ans,Xmin,Xmin/3
Shade(-Ans,Ans,Xmax/3,Xmax,1,1,Ans

(assumes a default [-10,10,1] by [-10,10,1] graph area)

Would be 4 bytes shorter without the first 2 lines, but by default would have axes and would not look as nice.

Looks like this:

If the shading is invalid for the challenge, let me know!

Without the first 2 lines, it looks like this:

Answer 14

JavaScript, 140 143 147 151 153 bytes

   with(document)with(body.appendChild(createElement`canvas`).getContext`2d`)for(i=2;i--;fillRect(i*52,0,26,52))fillStyle=i?"#ef4135":"#0055a4"

---

Edits

• Saved 2 bytes by replacing 2*i*26 with i*52. Thanks to Cᴏɴᴏʀ O'Bʀɪᴇɴ.

• Saved 4 bytes by refactoring the for-loop. Thanks to ETHproductions.

• Saved 2 bytes by using the with-statement. Thanks to Dendrobium.

• Saved 2 bytes by turning increment into decrement. Thanks to Shaun H.

• Saved 3 bytes by replacing fillStyle=["#0055a4","#ef4135"][i] with i?"#ef4135":"#0055a4".

Answer 15

R, 59 bytes

frame();rect(0:2/3,0,1:3/3,1,,,c("#0055a4",0,"#ef4135"),NA)

Output is displayed:

One can also do 49 bytes with

barplot(rep(1,3),,0,col=c("#0055a4",0,"#ef4135"))

if you do not mind the axes and borders:

Answer 16

Mathematica, 63 94 103 bytes

When I first saw this challenge, I thought Sweet! Mathematica would be perfect for this! until I noticed that built-ins were banned :'(

But wait! I can use bar graphs!

r=RGBColor;BarChart[{1,1,1},ChartStyle->{r@"#0055a4",White,r@"#ef4135"},BarSpacing->0,AspectRatio->2/3]

(Thanks to Martin Büttner for shaving off 5 bytes but adding 16)

Looks like this:

If you add ,Axes->None it looks like this:

If you don't care about the border, you can use this: (95 bytes)

r=RGBColor;BarChart[{1,1},ChartStyle->{r@"#0055a4",r@"#ef4135"},BarSpacing->1,AspectRatio->2/3,Axes->None]

Looks like this:

Without axes:

Answer 17

Blitz 2D/3D, 154 108 bytes

This produces exactly the same thing as the example given in the question (except for the anti-aliasing at the edges where colors meet).

Graphics 800,533
ClsColor 255,255,255
Cls
Color 0,35,149
Rect 0,0,267,533
Color 237,41,57
Rect 533,0,267,533

Output is displayed and it looks like this:

Answer 18

pb, 68 bytes

cw[Y!52]{cccw[X!26]{b[77]>}ccccw[X!52]{b[77]>}cw[X!78]{b[77]>}<[X]v}

Wow, a challenge that pb is actually kinda good for! Those are few and far between.

When I was writing the spec for pb, I included coloured output mostly as a joke. The language was named after a "paintbrush", why would it not do colour? Other than example programs, this is the second time I've ever used it. It is implemented with ANSI codes as the question requires.

I used 'M' as the character to output with because it's fairly dense.

Output:

I resized that screenshot vertically to be two thirds of its height because letters aren't square. The output is 78 by 52, but the original screenshot looks really wrong.

With comments and indentation and junk:

c               # Increase output colour by 1
                # 0 (White) -> 1 (Red)
                # Loop ends with output colour == 1, this is cheaper than
                # setting it back to white every time.

w[Y!52]{        # While the brush's Y coordinate is not 52:
    ccc           # Increase output colour by 3
                    # 1 (Red) -> 4 (Blue)

    w[X!26]{      # While the brush's X coordinate is not 26:
        b[77]       # Write 'M' at the brush's coordinates
        >           # Increase X coordinate by 1
    }             

    cccc          # Increase output colour by 4
                    # 4 (Blue) -> 8 mod 8 = 0 (White)

    w[X!52]{      # While the brush's X coordinate is not 52:
        b[77]       # (same as before)
        >         
    }             

    c             # Increase output colour by 1
                    # 0 (White) -> 1 (Red)

    w[X!78]{      # While the brush's X coordinate is not 78:
        b[77]       # (same as before)
        >
    }

    <[X]          # Set X back to 0
    v             # Increase Y by 1
}

Answer 19

Javascript (ES6) 117 bytes

Draws it in the console

for(i=c=s=[];i<156;c[i++]=`color:${[,'blue','#fff'][i%3]||(s+=`
`,'red')}`)s+='%c'+'+'.repeat(26);console.log(s,...c)

Answer 20

MATLAB, 82 79 78 bytes

x=[0 1 1 0];y(3:4)=2;fill(x,y,[0 85 164]/255,x+1,y,'w',x+2,y,[239 65 53]/255)

Output looks like:

Answer 21

C, 115 bytes

#define c"[48;2;%d;%d;%dm%9c"
d=255;main(a){while(a++<9)printf(c c c c,0,85,164,0,d,d,d,0,239,65,53,0,0,0,0,10);}

Contains unprintables:

00000000: 2364 6566 696e 6520 6322 1b5b 3438 3b32  #define c".[48;2
00000010: 3b25 643b 2564 3b25 646d 2539 6322 0a64  ;%d;%d;%dm%9c".d
00000020: 3d32 3535 3b6d 6169 6e28 6129 7b77 6869  =255;main(a){whi
00000030: 6c65 2861 2b2b 3c39 2970 7269 6e74 6628  le(a++<9)printf(
00000040: 6320 6320 6320 632c 302c 3835 2c31 3634  c c c c,0,85,164
00000050: 2c30 2c64 2c64 2c64 2c30 2c32 3339 2c36  ,0,d,d,d,0,239,6
00000060: 352c 3533 2c30 2c30 2c30 2c30 2c31 3029  5,53,0,0,0,0,10)
00000070: 3b7d 0a                                  ;}.

For this program to work, a couple of things need to be true:

• The terminal supports the ESC [48;2;<r>;<g>;<b>m "truecolor" escape sequence.
• The terminal is not xterm, becase xterm's implementation of the above will produce slightly wrong colors.
• The terminal completely ignores NUL characters.

It also looks nicer if your terminal's background is black.

To change to height of the flag, pass command line arguments to the program. For every argument passed, the flag becomes one line shorter. It's not a bug, it's a feature!

Output:

Answer 22

Visual Basic+Excel, 618 137 bytes

Just curious to see how this can be golfed.

EDIT: Curiosity sated, thanks to @Neil and @JimmyJazzx, 618 bytes dropped right down to 137 bytes

Sub a(): Columns("A:C").ColumnWidth = 26: Range("A1:A13").Interior.Color = RGB(0, 85, 164): Range("C1:C13").Interior.Color = RGB(239, 65, 53): End Sub

Answer 23

CSS, 102 110 111 114 bytes

*{background:linear-gradient(90deg,#0055a4 33%,#fff 33%,#fff 66%,#ef4135 66%) 0 0/78px 52px no-repeat

Answer 24

Dyalog APL (47 44)

⎕SM←↑1 21 41{(''⍴⍨2/20)1⍺,⍵,⍨4↑0}¨2*8 11 10

Result:

Answer 25

iKe, 43 bytes

,(0 0;"|"\"#0055A4|#FFF|#EF4135";52#,&3#26)

This is an example of a "raw tuple" iKe program- it's just a description of an origin (0 0), a palette (3 7#"#0055A4#FFFFFF#EF4135") and a bitmap (+52#'&3#26). You need to wrap a description like this in a function or use references to views if you want to animate it.

The palette is a very simple way of creating a series of CSS colors, hex equivalents of the spec.

  3 7#"#0055A4#FFFFFF#EF4135"
("#0055A4"
 "#FFFFFF"
 "#EF4135")

If the color requirements were less stringent we could use one of iKe's built-in palettes and save a considerable number of characters:

windows@7 0 4

Try it in your browser.

Edit:

Saved one byte by using a short #FFF CSS color for the white stripe:

,(0 0;3 7#"#0055A4#FFFFFF#EF4135";+52#'&3#26)
,(0 0;"|"\"#0055A4|#FFF|#EF4135";+52#'&3#26)

If anyone else is interested in playing with iKe, there's a manual on the github repo. here's another problem I solved using iKe.

Edit 2:

Saved one byte with a simpler way to construct the bitmap:

+52#'&3#26
52#,&3#26

My question in the OP hasn't been answered, but for the record if more flexible color requirements are permitted, this program would be 30 bytes by using the Windows 3.1 palette:

,(0 0;windows@7 0 4;52#,&3#26)

Since this problem was posted, iKe has gained a feature which automatically centers textures drawn without a position, which could save another 3 bytes, but this would be against the rules:

,(;windows@7 0 4;52#,&3#26)

Answer 26

Octave, 77 76 bytes

s(98,49)=0;imshow(cat(3,[s w=s+255 w-18],[s+35 w s+41],[s+149 w s+57])/255);

Displays the image:

Answer 27

Processing, 100 Bytes

size(78,52);background(255);noStroke();fill(#0055A4);rect(0,0,26,52);fill(#EF4135);rect(52,0,26,52);

Displays this:

(The naive solution is shorter than my first one.)

Answer 28

ShaderToy (GLSL), 147 bytes

void mainImage(out vec4 o,vec2 i){float x=i.x/iResolution.x*3.0;vec3 w=vec3(255,255,255);o=vec4((x<1.0?vec3(0,85,164):x<2.0?w:vec3(239,65,53))/w,1);}

See it here

Not particularly exciting. I'm sure there are ways to golf it more; I'll take a crack when I get home.

Answer 29

Ruby, 56 47 45 bytes

ASCII

$><<"\e[34z\e[37z\e[31z\n".gsub(?z,?m*27)*52

Answer 30

PHP, 70 bytes

0000000: 424d 0000 0000 0000 0000 2300 0000 0c00  BM........#.....
0000010: 0000 2001 c000 0100 0800 a455 00ff ffff  .. ........U....
0000020: 3541 ef3c 3f66 6f72 283b 3665 343e 2469  5A.<?for(;6e4>$i
0000030: 3b29 6563 686f 2063 6872 2824 692b 2b2f  ;)echo chr($i++/
0000040: 3936 2533 293b                           96%3);

The above is a hexdump which may be reversed with xxd -r. Alternatively, it may also be generated with the following PHP script:

<?=hex2bin('424d0000000000000000230000000c0000002001c00001000800a45500ffffff3541ef3c3f666f72283b3665343e24693b296563686f206368722824692b2b2f39362533293b');

I assume default settings, as they are without an .ini (you may disable your local .ini with the -n option). Produces a .bmp image (288 x 192), which should be piped to a file. This is as large as I can make it without affecting the byte count.

---

Sample Usage

$ xxd -r in.hex > france.php
$ php -n france.php > out.bmp
$ out.bmp

---

Output