Create a Pride Flag

Question

Challenge

Create the image of a pride flag (rainbow flag), i.e. a six coloured striped flag (from top to bottom): red, orange, yellow, green, blue, and violet.

Output

Example (R)

barplot(rep(1, 6), horiz = TRUE, axes = FALSE, space = 0, border = NA, col = c("darkviolet", "blue", "darkgreen", "yellow", "orange", "red"))

Rules

• The algo should actually create the image, not just load an existing one.
• You may use any colors reasonably recognizable as "red", "orange", "yellow, "green", "blue", and "violet".
• The flag may either be scalable (such as an SVG, or output that scales to window size) or at least size 200px by 300px.
• All coloured areas should be of the same size.

Every answer must include the resulting picture!

Credits: this post was inspired by the following post: Draw the flag of Tennessee.

Answer 1

Red, 73 bytes

view/tight[style s: box 315x35 below s red s#fa0 s#ff0 s#0f0 s#00f s#808]

Works in Red console. To run as a standalone program, we must add in front:

Red[needs view]

I don't know, whether this has to be counted.

Answer 2

Vyxal sḢ, 49 bytes

`<hr «⟇=øḢ-÷¥:#%7;¨→:14vh;₃ṁ:0;¤¯:0>`»‡Ė\Tµi»Hǒv%

Try it Online!

Stuff Vyxal isn't meant to do! This took far too long. The Ḣ flag renders stdout as HTML.

               v  # Over each element of...
     »‡Ė\Tµi»     # A compressed integer
             Hǒ   # Split into chunks of two...
                % # Insert that into...
`...`             # Compresssed string `<hr style=background-color:#%7;height:14vh;margin:0;border:0>`
                  # (s flag) turn the result into something HTML understands
                  # (Ḣ flag) render the output as HTML

For compression purposes, all the character codes end in 7.

Answer 3

Postscript, 42 bytes

Hand tokenised (42 bytes including showpage, 40 bytes without).

00000000: 36 88 09 32 5b 30 20 2e 31 92 38 30 88 f7 88 f7  6..2[0 .1.80....
00000010: 5d 7b 8e 05 88 33 3c e3 00 7d 8d 00 33 20 63 6f  ]{...3<..}..3 co
00000020: 6c 6f 72 69 6d 61 67 65 92 a1                    lorimage..

No tokenisation (62 bytes including showpage, 53 bytes without):

6 9 2[0 .1 .1 0 -9 -9]{<88333ce30>}false 3 colorimage
showpage

This renders to about 3.2 by 2.1 cm (0.8" by 1.25"). The size is limited by the constants '.1'. Making the flag bigger requires a smaller number which will need one extra byte (two bytes in the untokenised version).

The tokenised version is the same as the untokenised version except the ".1 .1" is encoded as ".1 dup" to save a byte.

Answer 4

DOS 80186 .COM executable, 31 30 bytes

xxd:

00000000: b0 13 cd 10 68 00 a0 07 31 ff be 18 01 ac b9 80  ....h...1.......
00000010: 2a f3 aa 3c 05 75 f6 c3 28 2a 2c 02 20 05        *..<.u..(*,. .

Commented assembly:

        ; NASM syntax
        [cpu 186]
        [org 0x100]
start:
        ; Set DOS to mode 13h for 320x200, 256 colors
        ; Since we know the DOS startup state, we can just set AL.
        mov     al, 0x13 ; 0x0013
        int     0x10
        ; Set ES to point to the video ram segment
        push    0xa000
        pop     es
        ; Set DI to point to the start of video ram
        xor     di, di
        ; Set SI to our lookup table
        mov     si, colors
.loop:
        ; Load color from lookup table
        lodsb
        ; Roughly 1/6 of the screen
        ; ceil(200 / 6) * 320
        mov     cx, 10880
        ; For all CX iterations, store byte to video ram
        rep     stosb
        ; Check for last byte in lut and loop if it is not
        ; that.
        cmp     al, 5
        jnz     .loop
.ret:
        ; Return to DOS, leaving a pretty but annoying flag on
        ; the screen that requires a manual mode reset.
        ret
 
        ; Lookup table for the default 256 color palette.
colors:
        ;   R   O   Y   G   B   P
        db 40, 42, 44,  2, 32,  5

I'm not sure if this is valid, as the last stripe is technically a bit shorter than the others, but 200 is not a multiple of 6 so it is unavoidable at this size.

Screenshot (the C:\CODE> part is simply the DOS prompt overwriting it after exiting)

• 1 byte: stosb already stores to the es segment. What a dummy.

Answer 5

SVG, 254 bytes HTML, 181 173 165 bytes

By moving from SVG to HTML, I can get away with not specifying a bunch of things and leaving some tags open.

• Saved ~ 70 bytes thanks to Wheat Wizard.
• Saved 8 + 8 bytes thanks to pxeger.

<svg><rect y=0 fill=red /><rect y=1 fill=#fa0 /><rect y=2 fill=#ff0 /><rect y=3 fill=#4f0 /><rect y=4 fill=blue /><rect y=5 fill=#808><style>rect{width:8px;height:1px

After zooming in a lot, you can see

Answer 6

C, 69 bytes

I don't have comment privileges yet, so I'm adding this as another answer. This is an improvement on @weirdsmiley's answer.

#define p(s)puts("\e["#s"m█");
main(){p(91)p(31)p(93)p(32)p(34)p(35)}

Try it on godbolt

I added the the \e[ and m to the p macro because it was used 6 times in each macro invocation. Also the \e[0m (which resets the color) can be removed because the color is overwritten again before each puts.

If there was a way to make the 91 and 93 start with a 3, then it might save a few bytes by being able to remove the 3 from the 30s.

I'm new to codegolf, so I'm sure if this is 69 or more bytes (because of the █ character).

Answer 7

Desmos, 75 bytes

k=255
C=rgb([k,k,k,0,0,75],[0,165,k,k,0,0],[0,0,0,0,k,k])
[5...0]<y<[6...1]

Result:

Technically, each colored bar has the same area of infinity, but if that's not allowed, then you can simply add a domain restriction at the end of the inequality with the cost of some additional bytes.

Try It On Desmos!

Try It On Desmos! - Prettified

There must be some way to golf that huge rgb() expression, but I don't see a way at the moment...

---

Bonus Answer, 5 bytes

pride

If you paste pride into an empty expression, Desmos will automatically redirect you to a graph of the pride flag.

You have a chance of getting this graph:

Or this graph:

Answer 8

Nim, 862 274 246 bytes

var
  y=33.0
  m=newImage(297,198)
  c=newContext(m)
  r=y/2
for i in 0..5:c.strokeStyle="#FF5C00#FF8C00#FFE900#006400#00008B#4B0082"[i*7..i*7+6];c.lineWidth=y;c.strokeSegment(segment(vec2(0,r),vec2(y*9,r)));r+=y;m.writeFile("l.png")

Using the Nim library pixie. If you have Nim and Nimble installed, a quick nimble install pixie should let you run it perfectly! It outputs to l.png. I am inexperienced with Pixie and Nim, so if I did anything wrong, please let me know. This answer has gone through a lot of revisions, from totally un-golfy to fairly golfed. Bytes were counted using wc -c.

Answer 9

TikZ, 164 bytes

\documentclass[tikz]{standalone}\begin{document}\tikz{\foreach\u\c in{1/purple,2/blue,3/green,4/yellow,5/orange,6/red}{\fill[\c](,\u)rectangle(9,7);}}\end{document}

Pretty simple.

\documentclass[tikz]{standalone}\begin{document}\tikz{ % boilerplate
% For every color and index ascending from the bottom.
\foreach\u\c in{1/purple,2/blue,3/green,4/yellow,5/orange,6/red}{
   % Draw a filled rectangle in that color from (0,u) to the upper right corner
   \fill[\c](,\u)rectangle(9,7);
}
}\end{document} %boilerplate

Answer 10

QBasic, 78 bytes

SCREEN 9
FOR i=0TO 5
READ c
LINE(0,i*40)-(400,239),c,BF
NEXT
DATA 4,6,14,2,9,5

The orange looks more like brown, in my opinion, but it's the closest QBasic has (it's the dark version of yellow). Here's the output when run on DOSBox at Archive.org:

Answer 11

Python 3 + Turtle, 183 bytes

from turtle import*
for x in "red orange yellow green blue violet".split():fillcolor(x);begin_fill();exec("fd(200);lt(90);fd(20);lt(90);"*2);end_fill();rt(90);fd(20);lt(90)
mainloop()

The turtle pointer by default starts at cartesian coordinates (0,0) so the image is in the 4^th quadrant.

Answer 12

Wolfram Language (Mathematica), 142 139 bytes

BarChart[1~Table~6,BarOrigin->Left,ChartStyle->{Purple,Blue,Green,Yellow,Orange,Red},BarSpacing->0,Axes->0>1,ChartBaseStyle->EdgeForm@None]

ChartBaseStyle->EdgeForm@None removes the faint black lines that would normally separate each bar.

-3 bytes thanks to att.

Answer 13

Python 3, 108 89 85 80 bytes

print("P3 300 204 9")
for x in range(6):print(*"900960990070009707"[x::6]*10200)

Try it online!

Huge change (-22 chars) thanks to ovs, and -5 more from Wheat Wizard!

The output is an ASCII PPM image file, which is easy to generate but incredibly inefficient space-wise. So even at 300x204 pixels it's too larger for TIO, so it's truncated if you run the code there.

Here's an explanation.

print("P3 300 204 9")                        # Print the PPM header (1)
for x in range(6): ...                       # For each distinct color
... print(*"900960990070009707"[x::6]*10200) # Print 10200 copies of the RGB value (2)

(1) - P3 means it's an RGB image, 300 204 are the dimensions and the last number if the max RGB value 9 in this case so that we can use single digit values.

(2) - The RGB values are single byte since the color depth in the header is given as 9. The string 900960990070009707 holds the 3 digit RGB values for each of the 6 rows.

The image uploader won't accept a PPM file so I loaded it into GIMP and exported it as a PNG to include it.

Answer 14

JavaScript - 165 bytes

The snippet works in the console.

console.log(...["red","orange","#ff0","green","#00f","violet"].reduce((a,c)=>{a[0]=a[0]+'%c0';return [...a,`background:${c};color:${c};padding:35px 400px;`];},['']))

EDIT:

Used Chrome Version 91.0.4472.114 (Official Build) (x86_64) for creating the image.

Answer 15

Japt, 91 57 bytes

The latest entry in my series of making Japt do things it shouldn't be able to do!

Ol"%c "²³$,...$`fÇÛÆèÆǾb`roT ò3 Ëi`padÜA:2%26%;baå®":#

Test it (Open your browser's console. Only tested in Chrome.)

Original solution

$flags$
`fÇÛÆèÆǾb`roT ò3 £$V.before(V.cloneNode(),V.style.border=V.style.background='#'+X

Test it

Answer 16

Swift + UIKit, 216 bytes

A function that returns a UIView.

func f()->UIView{let v=UIStackView(arrangedSubviews:[UIColor]([.red,.orange,.yellow,.green,.blue,.purple]).map{let v=UIView()
v.backgroundColor=$0
return v})
v.axis = .vertical
v.distribution = .fillEqually
return v}

You can't remove the whitespace around the last two = operators.

Result when displayed at full screen on iPhone Xʀ:

Swift + SwiftUI, 90 bytes

A View. Not a function that returns one -- you could say let prideFlag = /* the answer */, or include the answer directly in a ViewBuilder.

VStack(spacing:0){Color.red
Color.orange
Color.yellow
Color.green
Color.blue
Color.purple}

This is why everyone prefers SwiftUI.

The colors are slightly different, and it doesn't let itself extend into the margins at the top/bottom of the screen, but the result is very similar:

Answer 17

Python 3 with pygame, 166 152 bytes

I wrote this before realizing there was another pygame answer here, but I'm still posting it because I wrote it independently, and it does use a rather different method for getting the colors.

from pygame import*
d=display
s=d.set_mode()
for i in range(6):
 draw.rect(s,("red","orange","yellow","green","blue","purple")[i],(0,i*3,32,3))
d.flip()

Edit -14 bytes: Some golfing I did on another pygame answer I just posted helped me golf this one too.

New output:

As the size makes this almost illegible, here's a scaled up version (from the older code, hence the window bar at the top) for better viewing:

Answer 18

Pygame, 171 bytes

from pygame import*
d=display
e=99
s=d.set_mode((e*9,e*6))
m=[255]
l=[0]
i=0
for c in[m+l*2,m+[e]+l,m*2+l,l+m+l,l+l+m,[e,0,e]]:draw.rect(s,c,(0,i*e,e*9,e));i+=1
d.update()

Here's the flag generated:

Answer 19

K (oK) + iKe, 79 bytes

w:300
h:200
{(0,x*34;,("red";"#fa0";"#ff0";"#0f0";"#00f";"#808")x;(34;w)#0)}'!6

Try it online!

Draws a static bitmap with 300x200px area.

Answer 20

C, 171 bytes 118 bytes 100 bytes

EDIT: Saved 53 bytes thanks to Wheat Wizard and 14 bytes thanks to ceilingcat

#define p(s) printf(#s"█\e[0m\n");
main(){p(\e[91m)p(\e[31m)p(\e[93m)p(\e[32m)p(\e[34m)p(\e[35m)}

Try on godbolt!

NOTE: Output differs a little according to Godbolt's UI.

Here is the output from my native machine.

Answer 21

R + ggplot2,150 bytes - https://cran.r-project.org/web/packages/ggplot2/index.html

library(ggplot2);ggplot(data.frame(y=1:6),aes(y=y))+theme_void()+geom_bar(fill=c("#9400D3","#0000FF","#006400","#FFFF00","#FFA500","#FF0000"),width=1)

the output image

Answer 22

JavaScript, 107 bytes

console.log(`%c `.repeat(6),...`f00fa0ff00f000fb0b`.match(/.../g).map(c=>`background:#${c};padding:2%26%`))

Open your browser's console and run the snippet below.

console.clear()
console.log(`%c `.repeat(6),...`f00fa0ff00f000fb0b`.match(/.../g).map(c=>`background:#${c};padding:2%26%`))

Answer 23

Big Unicorn, 54 bytes

C1P9T1P2T1C7P9T3P2C2T3P9T1P2T1C9P9T3P2T3C3P9T1P2T1C8P9

Unicorns sure do love rainbows...

Answer 24

dc + QOI, 116 bytes

16i[qoif]P0dPP1P32P0ddPPPCCP3P0P5AP[A7[FDP1-d0<R]dsRxF0Pk]ddddddxFEPFFP80P0PxFEPFFdPP0Px7APx6DPx5APx0ddddddPPPPPPP1P

Outputs a 306x204 image to stdout in the Quite OK Image Format (shown here converted to png):

QOI images can be viewed with ImageMagick, among other software:

dc -e"16i[qoif]P0dPP1P32P0ddPPPCCP3P0P5AP[A7[FDP1-d0<R]dsRxF0Pk]ddddddxFEPFFP80P0PxFEPFFdPP0Px7APx6DPx5APx0ddddddPPPPPPP1P" | magick display 

Answer 25

HTML, 330 245 bytes

Saved 7 bytes thanks to Wheat Wizard!

Saved 78 bytes thanks to Recursive Co.!

<div style="background:red">&nbsp;</div><div style="background:#F60">&nbsp;</div><div style="background:#CF0">&nbsp;</div><div style="background:#0F0">&nbsp;</div><div style="background:blue">&nbsp;</div><div style="background:#C0F">&nbsp;</div>

Answer 26

ConTeXt, 112 bytes

It produces PDF, hence scalable, output:

\startMPpage for i=0upto5:draw(0,-i)--(5,-i)withcolor hsvtorgb(i*(25+6i),1,1)withpen pensquare;endfor\stopMPpage

Answer 27

HTML & CSS — 207 bytes

hr{height:30px;margin:0;border:0}hr{background:red}*+hr{background:orange}*+*+hr{background:yellow}*+*+*+hr{background:green}*+*+*+*+hr{background:blue}*+*+*+*+*+hr{background:violet}

<hr><hr><hr><hr><hr><hr>

Answer 28

R, 80 65 45 bytes

image(t(1:6),c=rainbow(12)[c(10,8,4:1)],ax=F)

Try it at rdrr.io!

Original 80-byte version

plot(0,,,1:2,c(1,7),,,,"","",,F);rect(1,7:2,2,6:1,,,rainbow(12)[c(1:4,8,10)],NA)

Try it at rdrr.io!

Answer 29

Scratch, 289 bytes

when gf clicked
add(16753920)to[l v
add(16776960)to[l v
add(65280)to[l v
add(255)to[l v
add(8388736) to [l v
set pen color to(()+(16711680
set pen size to(800
pen down
repeat(5
change[a v] by (1
go to x:(-240)y:((150)-((60)*(a
set pen size to(60
set pen color to(item(a)of[l v
set x to(240

Try it online! | Test it on Scratchblocks!

Answer 30

05AB1E, 26 bytes

„P3ƵÈDY•2Ûm¤Ç{wÕ•3ôŽwÓ×S»»

Try it online! Outputs as a plain PPM.

Output