# Little Boxes on the Hillside

There's a satirical song called Little Boxes, originally by Malvina Reynolds, about suburban sprawl that has lyrics as follows:

Little boxes on the hillside,
Little boxes on the hillside,
Little boxes all the same.
There's a green one and a pink one
And a blue one and a yellow one,
And they're all made out of ticky-tacky
And they all look just the same.

Your job here is, given an integer input n>1 that represents the size of the house, output the four "little boxes" using the following colors (in 0xRRGGBB notation):

Green -- 0x00FF00
Pink --- 0xFF00FF (technically magenta)
Blue --- 0x0000FF
Yellow - 0xFFFF00


If your particular console doesn't have these exact colors, you may use the closest available (e.g., ANSI escape codes).

The houses are constructed with n _ representing the floor and roofline. They are surrounded by n/2 (round-up) | characters representing the walls. The roofs are always 2 high and are two / on the left edge, two \ on the right edge, and n-2 - representing the roof peak. As the houses get larger, the comparative size of the roof gets smaller; this is intended.

Here's a house of size 2:

 /\
/__\
|__|


Here's size 3:

 /-\
/___\
|   |
|___|


Here's size 7:

 /-----\
/_______\
|       |
|       |
|       |
|_______|


Thus given an input of 7, output four houses of size 7 as described above, with the first one in green, the second in pink (magenta), the third in blue, and the fourth in yellow. Output of the colors in that order is important.

Example picture of size 3:

### Rules

• The houses can be horizontal or vertical so long as there is a clear separation between them.
• Leading/trailing newlines or other whitespace are optional, provided that the houses line up appropriately.
• Either a full program or a function are acceptable. If a function, you can return the output rather than printing it.
• Output can be to the console, saved as an image, etc.
• Standard loopholes are forbidden.
• This is so all usual golfing rules apply, and the shortest code (in bytes) wins.

# JavaScript (ES6), Chrome / Firefox, 156148151 150 bytes

Saved 8 bytes thanks to @Shaggy
Saved 1 byte thanks to @Neil

n=>['0f0','f0f','00f','ff0'].map(c=>console.log(%c /${'-'[r='repeat'](n-2)}\\ /${s='_'[r](n)}\\
${(|${' '[r](n)}|
)[r](~-n/2)}|${s}|,'color:#'+c))  ### Demo Make sure to open the console of your browser to get the colored output. let f = n=>['0f0','f0f','00f','ff0'].map(c=>console.log(%c /${'-'[r='repeat'](n-2)}\\
/${s='_'[r](n)}\\${(|${' '[r](n)}| )[r](~-n/2)}|${s}|,'color:#'+c))

f(3)

• Works fine for me as a Snippet, with my browser's console open. Save 8 bytes by using the 3 digit hex codes: tio.run/##NYvRCsIgGEbv9xSDFr/… Sep 21 '17 at 17:12
• @Shaggy Thanks for the suggestions! Sep 21 '17 at 17:21
• Are the leading 0s necessary? Sep 21 '17 at 17:22
• @JonathanFrech Yes. Without the leading zeros, that would not be valid #RGB CSS color codes. Sep 21 '17 at 17:26
• I think the height is wrong on the wider houses.
– Neil
Sep 21 '17 at 18:32

# Python 2, 123121119111109 108 bytes

• Saved two bytes thanks to caird coinheringaahing; using the actual unprintable ASCII character instead of escaping it (\33)
• Could (and did) save a byte by writing an entire program using input() instead of defining a function
• Saved seven bytes thanks to ElPedro; using the fact that str(90+n) with 0<=n<=9 is "9%s"%n
• Saved two three bytes by using string formatting rather than string concatenation

N=input()
for(n)in"2543":Z="_"*N;print"[9%sm /"%n+~-~-N*"-"+"\ \n/%s\\\n"%Z+~-N/2*("|%s|\n"%" "*N)+"|%s|"%Z


Try it online!

Uses ANSI escape codes for coloring the houses.

• 119 bytes Sep 21 '17 at 17:08
• 112 by looping "2543" and using string formatting - Try it online! Sep 22 '17 at 10:16
• @ElPedro Thanks. Did not occur to me that 90 and 2,5,4,3 summed up is effectively concatenation. Sep 22 '17 at 10:27

# Excel VBA, 243 Bytes

Anonymous VBE immediate window function that takes input from A1 and outputs to the range A2:A5

[C1]=vbLf:For i=1To 4:Cells(i+1,1)=[" /"&Rept("-",A1-2)&"\"&C1&"/"&Rept("_",A1)&"\"&C1&Rept("|"&Rept(" ",A1)&"|"&C1,A1/2)&"|"&Rept("_",A1)&"|"]:Cells(i+1,1).Font.Color=Array(32768,&HFF00FF,rgbBlue,65535)(i-1):Next:Cells.Font.Name="Courier New"


# Japt, 79767473 72 bytes

3#²¤r1'f ò3 w £Ol"%c /{ç- ¤}\\
/{ç'_}\\
{/2-½ ç"|{ç}|
"}|{ç'_}|"Xi¬l:#


Try it (Open your browser's console before hitting "Run").

Thanks to ETH for helping me to test this last night while I was working it up on my phone.

## Explanation

Implicit input of integer U

3#²¤r1'f ò3 w


First we build an array of 3-digit hex colours to map over. The charcode of ² is 178 so 3#² gives us 3178. We convert that to a base-2 string with ¤ and then replace all occurrences of 1 with f. ò3 splits the string into an array of strings of length 3 and w reverses that array.
(I need to figure out a way to shorten that, somehow.)

£Ol


We map over the array using £ - with X being the current element - and Ol logs to console. We'll be passing 2 strings to that, one containing the house and one containing the CSS.

Xi¬l:#


The second string is constructed using i to prepend X with the compressed string color:#.

"%c /{ç- ¤}\\


The %c tells the console to use the second string as CSS. The top line of the house is built by repeating (ç) the - character U times and then slicing that from the second element (0-indexed) with ¤. The braces act as a shortcut, of sorts, for string concatenation.

/{ç'_}\\


The second line is built in a similar way, this time repeating the _ character U times.

{/2-½ çRi|²iUç 1}


The body of the house is built by first repeating the | character twice with ² and then inserting a space repeated U times into that string at index 1. The resulting string is then prepended to a newline (R) and that string is repeated U/2-0.5 times.

|{ç'_}|"


Finally, the last line is built in the same way as the second.

• Coolest Japt answer. Oct 30 '20 at 16:40
• You only say that 'cause Japt shouldn't be able to do this, @Razetime! :D Oct 30 '20 at 16:43
• Well, that's the point, isn't it? Oct 30 '20 at 16:55

# Python 2, 120 bytes

n=input()
for i in'2543':s='_'*n;print'[1;3'+i+('m /'+'-'*(n-2)+'\ \n/%s\\\n'%s+(-~n/2-1)*('|'+' '*n+'|\n')+'|%s|\n'%s)


Try it online! (shows escape chars instead of actual colors, tested on local terminal)

• I think your houses are too high for inputs like n=2. Sep 21 '17 at 17:18
• @JonathanFrech yep I'll fix...wrong ceiling approach apparently EDIT: fixed Sep 21 '17 at 17:19
• The question says to use the closest available, though you seem to use the normal colors instead of the bright colors. The bright colors -- I think -- would, however, be closer to the desired colors. Sep 21 '17 at 17:31
• @JonathanFrech Hmm, yours seems to be using the normal colors too, but yeah the bright ones are closer. Sep 21 '17 at 17:32
• @ElPedro Anyways his has turned out better than mine :p Sep 22 '17 at 19:01

# Yabasic, 220 bytes

An anonymous function that takes input as an integer, n and outputs 4 colored homes to the terminal.

The lack of a dedicated string repeating or replacement function in yabsic really hurts this response.

Clear Screen
Input""n
b$="__" c$="|  "
For i=1To n-2
a$=a$+"-"
b$=b$+"_"
c$=c$+" "
Next
c$=c$+"|\n"
For i=1To n-4
d$=d$+c$Next For i=0To 3 ?Color(Mid$("gremagbluyel",1+3*i,3))" /"+a$+"\\\n/"+b$+"\\\n"+d$+"|"+b$+"|"
Next


This version requires graphics mode and thus does not work on TIO.

### Output

The input value for the below is n=7.

# SmileBASIC, 115 bytes

INPUT N
H.H 6H 4H 2DEF H C
COLOR C+5?" /";"-"*(N-2);"\
?"/";"_"*N;"\
FOR I=3TO N?"|";" "*N;"|
NEXT?"|";"_"*N;"|
END


Another one which is also 115 bytes:

INPUT N
FOR J=0TO 3COLOR!!J*8-J*2+5?" /";"-"*(N-2);"\
?"/";"_"*N;"\
FOR I=3TO N?"|";" "*N;"|
NEXT?"|";"_"*N;"|
END


The colors codes I need (in 4-bit RGBI) are 5, 11, 9, 7. This is generated using !!J*8-J*2+5 If J is not 0, this is 13-J*2 (giving 11,9,7), and if it is, the result is just 5.