Used it on one of my Slugcat ocs, might use it on another. This code is awesome!

thank you!! :D

using!!! both on this guy and all of the other guys in their folder (except tribe of the citadel). heavy wip for all though

OOOO the grimoire's really cool!! :D glad you like the code! <3

using :3

currently only on this guy (it's also not finished) but will 100% use later on my slugcats & tulpa 

glad ya like it!! :D LJ's a cool character!!!

This user is not visible to guests.

thank you!!! :D

This user is not visible to guests.

this has been in my faves for a while, so there's a good chance i've already left a comment. still, i love this code so much! i've been playing rain world for a long time and it makes me happy to see other people enjoy it too!

AAHH thank you so much, i'm really glad you like it!! :'D

Hello! I love this code but it won’t work for me for some reason? https://toyhou.se/25327330.mintminty Could you help me?

i'm glad you like it!! are you using WYSIWYG?

Yea, plus profiletext is disabled, and code is on

hmm, can i see a screenshot of your code then? just the top couple of lines is fine!

IMG_8831.png?ex=65ceb809&is=65bc4309&hm=

...huh. did you inspect-element the HTML page and copy it from the devtools window...? whatever happened, it copied some extra tags that i used to format it for that page, which is why it got messed up. if you did anything other than highlighting the text on that page + copying it directly, try doing that instead. if that's what you did the first time, do it again and try ctrl + shift + v on desktop or "paste without formatting" (if that's an option) on mobile when you paste this time.

if you still see <pre><code> at the beginning of it after doing that, remove those tags manually (+ the matching ones at the very end) and remove the <a> tag around every link that looks like the one on line 7 (where the href is the same as the content inside the tag). like, turn this:

<a href="https://toyhou.se/18761520.-f2u-html-rain-world">https://toyhou.se/18761520.-f2u-html-rain-world</a>

into this:

https://toyhou.se/18761520.-f2u-html-rain-world

1 Replies
This user is not visible to guests.

i'm glad you like it! :D can you reply with a screenshot of what you're doing to the code that causes this?

This user is not visible to guests.

switching to WYSIWYG at any point will always irreversibly break the code, so first you'll have to turn WYSIWYG off (preferrably through here, where you can also turn on the code editor) and start over. you've got the right idea for how to add a background, but you also need to enclose the image url in url(), like this: background: url(YOURURLHERE);

This user is not visible to guests.

great, glad i could help! :D

Just wanna say this is beautiful! Definitely using it for my mains

thank you!! :D 💖💕

I tried to get it to work...

But all I got was this:https://toyhou.se/13918867.cyber-punk

Help... ;-;"

I suck at codes 

woof... there's a lot going on here haha. can you show me a screenshot of how the code looks in the editor, please?

you can't edit custom html with WYSIWYG on, it will always break—go here and turn WYSIWYG off for profile text and turn on the code editor, then remove all the code and try again

Ok

Thxs! It worked! ^^

1 Replies

Question: can I use it for my non rain world bab?

sure!!

Hey!

I used the code for my bab here. Just wanna let you know

oooo, kit's a really cool character!! :D

This code's been super useful for my slugcat and scav characters!! It's so in-depth and I had a great time using it :D

Question tho; if I fiddled around with it, do you think it would be possible to add more tabs? :0

i'm glad you like it!! :D that would absolutely be possible, you just need to copy one of these (the nav button):

image.png?ex=658ba0ab&is=65792bab&hm=c04

and one of these (the tab pane, which has all the actual tab content—they are collapsed in this screenshot, normally these are Very long):

image.png?ex=658ba0e6&is=65792be6&hm=ba2

and then just customize them how you wish :] also make sure only one of the tab panes has the "active" and "show" classes. feel free to ask further questions if you need, i didn't go into much detail here lmao

Oooohhh, that's so cool!!! Thank you :0 I might try that! I'll come back if I have further questions!

HELLO this is my new favorite code ever. i've never been able to find codes for my characters that really Stick but this one. ohhh man oh man gonna use this for all my rain world ocs from now on forever (as a sidenote i could immediately tell exactly where the room in the background of the code is, and i knew which region the rain gif in the misc tab was from (just not the specific room cause it's so zoomed in). i think i've played this game for too long)

AAAAHAAUUHAHSYGDF i'm so glad to hear you like it, thank you!!!! :D (and LMAO about the rooms, i actually knew EXACTLY which room i wanted to use the moment i sketched out this layout for the first time on paper. i was just like oooooooohhh the industrial/shaded hallway would be so perfect for this. what 800 hours in rain world does to a mf..... have you seen the rain world gueoguesser btw?)

YES I LOVE RAIN WORLD GEOGUESSER the link i had saved to it actually stopped working for some reason but this one works fine so?? thanks for that now i can rain world geoguess Forever. i think the funniest thing is that i rarely ever go the industrial -> shaded route but that room is just so ingrained into my head anyways. what 560 rain world hours does to a person...

using this for The Tamer!! Thanks so much!!

of course, i'm glad you like it!! <3

Hi! I decided to use this code for this little stinker, and I had a blast working on the code! Thank you so much for it! /gen /pos

Though, I am unsure on how to change the background part of the code that isn't the top or sidebar, the part that holds the information - how would I change that? :0 /nf /gen

omg i love your character!! :D and i'm glad you like the code! this is the section that controls the background of the whole code:

image.png?ex=65356663&is=6522f163&hm=ad5

if you just want to change the color to another flat color, you can just replace the #090410 with the hex code you want. if you want an image, you can replace the hex code with an image url like this:

image.png?ex=65356686&is=6522f186&hm=684

keep in mind, though, that the karma nav buttons use an image that's colored specifically to match the current background, so you'd have to recolor it manually for it to match. it's this one:

https://file.garden/ZR9T2HeuqFVzWPzq/toyhouse/rainworld/karma/karma_bg.png

and if you use an image as a background, it will be overlapped by the top and sidebar images

Gonna be using this for some of my rw chars when i build up their lore mor


This code is rlly cool btw :]

thank you!! :D

this code is so cool! though, its broken for me? more specifically the design tab. its formatting is a bit odd + the other tabs can only be opened when youre in the design tab. im pretty sure i messed up smth while trying to set it up ^^' ill try just changing it around until it gets back to working again LOL if anything ill edit this comment!

okay, i managed to fix it a bit, but still broken. :[ i can send the raw code if you want to check if i did some oopsies

hi, i'm glad you like it! :D my first thought is that you've probably accidentally deleted a closing </div> tag. try going through the code and making sure every <div> is properly closed. all opening <div> tags and their corresponding closing </div> tags should be aligned with the same spacing. if you have the code editor enabled and you put your cursor in one, the other will show up with a little outline around it. if any are misaligned, it's probably because one of the </div>s got deleted, and you can try to figure out where it should've been based on that.

if you still can't find it, please send the raw code my way and i can fix it for you! :]

thank you! i'll try that.

tysm! it was a missing closing div at the relationship tab :] again, thank you for the help!

no problem, glad you were able to get it figured out! :D

using this for my new slugsona and i plan to use it for any other creatures i make, thank you so much for this!!

WHOAAAA its design is so cool!! glad you like the code! :D

WAAA TYSM

Thank you so much for making this code! <3 My friend and I have been playing Rain World together a lot and she showed me this code and my first thought was "I really need to make a RW OC just so I have a reason to use this" and here I am with my first slugcat OC lmao

AAAAAA i'm so glad you like it!! :D the siren is a super cool character, i love its colors!!!

Using it for my Character now! This is amazing! Thank you so much for offering it for free!

of course, i'm glad you like it!! :D 💖

This user is not visible to guests.

thank you sm!!! :D

hiiii i used it for this silly and although im still going to need to fill the rest of everything ive left blank i plan on using this for future/ my other rain world ocs as well :333 ur html was so aWESOME!!

AAAAAA thank you, i'm really glad you like it!!!!!! i absolutely adore the sky islands retheme you did, it looks so good!!! :D

I'm still working on filling out the profile, but I'm using this for my new scug OC! Rain World has been my latest hyperfixation and I was really happy to find such a cool code while looking through characters!

AAHHH i'm glad you like it!!!! :D it's my #1 favorite game, i just knew i had to do a themed code for it haha. the shepherd is really cool!!!

Question, is there a way to add more pictures in the design tab? I tried just copy pasting and changing numbers but it didn't work.

hi! the method you described should work fine, make sure you're copying & changing both sections (the image and the button):

image.png

if it's not that, make sure your ids don't start with numbers or contain any special characters. and if it's not that either, please send a screenshot of this same part of the code and i'll figure it out!

This user is not visible to guests.

hi, thank you, i'm glad you like it!! :D i forget whether i got them from the wiki or the game's files but they're the same either way. i think the wiki recently (after i made this layout) added a black border to most of their UI images for better visibility in the mobile theme, but their images are also taken from the game's files and should be of the same quality (they are going to be low resolution wherever you find them, they're very small images). i also believe the atlas these images come from is now packed as of 1.9, but i still have a 1.5 installation of the game, so here it is if that interests you. you're also completely welcome to download the images i'm using in this layout directly and edit them. let me know if i can help anyhow else :]

This user is not visible to guests.

this code is so prettyyy oooooghhh... wanted to give it a go on this character of mine since i've been trying to figure stuff out with its lore and whatnot and this seemed like the perfect opportunity to do so thank you so so much!!! ^_^

AAAA thank you!!!! :D diesel is super cool btw i LOVE the iridescence and purple hues in its design!!

thank you so muchhhhhh!!! 💗 ^_^

This user is not visible to guests.

AAAA thank you, i'm really glad you like it!!! :D

used the code on this character and will on more! Thanks for the code! This is the perfect template for rw ocs 👍

also it seems something happened during the abilities section? it doesnt seem formatted correctly ^^

i'm glad you like it!! :D gris's abilities section looks fine for me in safari on ios and firefox on desktop; can you let me know what browser you're using and post a screenshot of the incorrect formatting so i can try to find the issue?

nevermind! I thought it was something funky with my add ons but it turns out to be just not having enough text in there ^^" Thank you though!

no worries! 1099094717670621194.webp?size=128&qualit

Hello! i love this coding a lot have everything! to, there a one thing I want add, I try but I dint found a way to do it, so idk if you can help me doing something like this? the character imagine be on the background: Example

hi, i'm glad you like it!! :D so the code for that image box is at the very end, and it looks like this:

<!------------ RIGHT BLOCK IMG ------------>
 <div class="col-auto hidden-lg-down" style="background: url(
 
 https://cdn.discordapp.com/attachments/625502029955203073/962224294417555506/rainworld10.png
 
 ); height: 419px; width: 233px; border-radius: 0 0 .25rem 0;"></div>

you can add another image on top of it by adding another url in front of the one that's already there, like this:

<!------------ RIGHT BLOCK IMG ------------>
 <div class="col-auto hidden-lg-down" style="
 
 background: url(YOURIMAGELINKHERE) no-repeat center,
 url(https://cdn.discordapp.com/attachments/625502029955203073/962224294417555506/rainworld10.png);
 
 background-size: contain; height: 419px; width: 233px; border-radius: 0 0 .25rem 0;"></div>

i changed the spacing here to make it more clear what's going on, but that won't actually affect anything. the green text is what you're going to want to add. the "no-repeat center" and "background-size: contain;" are there to position the image properly in the center of the image block.

omg thank you!! to, is there a way to make the imagine more bigger? due is floating :0

you can add another value to background-size: contain; such as background-size: 100px 200px, contain; or background-size: 150%, contain; to resize the new image, but it'll get cut off at the edges of the image box rather than hovering over it. the whole layout needs to use overflow: hidden; in order to prevent other elements from bleeding out of the box, so there's nothing you can do to get around that, unless you were to add the image as an <img> outside of the rest of the code instead and position it manually (similar to how i did the pagedoll in this code), but it might be a pain to position it responsively and without causing the whole page to scroll horizontally.

did it work!! tysm!

no problem, glad i could help! <3

Used on this one, thank you! :D

OOOO they're such a neat character!!!!! :D thanks for using my code!! <3

hi, I really like the look of this template (legitimately the layout and design is so pretty, am thinking of using it despite having no rain world ocs) but how do the progress bars work? i dont really know enough about code to feel comfy poking at them without breaking them, but id like to give them different percentages and whatnot

i'm glad you like it!! :D to adjust how much of the progress bars are filled, you just need to adjust the width: 50%; property for each to whatever percentages you want. i usually put the percent on a new line for emphasis when i templatize my codes, which i just realized i forgot to do for this one, so that's on me for not making it clearer lol! it should hopefully stand out a bit more now.

image.png

oh ok! thank you for the explanation!

I used the code on this character! Probably will use it on some other ocs later.

OOOO the firefly is such a cool character!!!!!!! :D thanks for using it, glad ya like it! <3

Love this! I've been using it for my rain world characters and it's perfect!

AAA i'm glad you like it, thanks so much!! :D

Hey!! I tried putting the CSS in and it didnt work :((

https://toyhou.se/19259376.kairo

Not sure if im doing things wrong or not, ive never used css before

hi, no worries! :D when you're editing a character profile with premium there's a seperate box for CSS below the box for HTML, but it's in a tab that's collapsed by default (it's kinda easy to miss so i getcha haha). it should just say "CSS" and clicking on it will open it and allow to you put stuff in there. if you're still having issues after you move it there, make sure all of the code comments are properly opened and closed—the syntax for CSS comments is /* text here */ and the syntax for HTML comments is <!-- text here -->

ohhhh tysmm!

The CSS isn't working for me?

can you describe the issue with a little more detail, or show me a screenshot of the code? :o i'd love to help troubleshoot but that's not much to go off of on its own

https://sta.sh/22arcscvgvw8?edit=1

And yes I do have premium! 

it looks like everything's working properly from those screenshots! (the custom scrollbar and nav effects are working at least, the hover effects i can't tell of course, but you put the code in right). what specifically are you having trouble with?

I guess I just thought it'd be changing the whole screen as thats what I'm used to with css! Like with my profile! But maybe thats me being dumb?

no worries!! CSS is most often used to do full-page overhauls on toyhou.se but the CSS for this code is just additional effects, since i wanted to keep it mostly HTML-only :] everything's active in the live preview here, and i listed everything it does in the description if you're curious. you can combine it with your own CSS if you want! (some things might get funky but it'd all be fixable stuff)

1 Replies

Ah i-
I usually dont post comments super often but i just wanted to say- This is so cool! Im a huge Rain world fan and i always get so happy when seeing other people who know about the game too i-
Im abit new to the game (been playing for i think only a few months, im still trying to beat Hunter and have i think 102 hours on the game rn lol) but really like it, and have actually been looking into making some ocs. Once i do, ill definitely use this ^^ The code looks awesome, i really like all of the karma symbols and all of the references, and just the theme and everything in general ^^
Ah this looks awesome! ^^
Okie dokie sorry ill go now before anxiety makes me too nervous to send this lol, just wanted to say that this looks awesome and is of the cool :D

thank you so much omg!!! :D rain world is my favorite game so i'm super glad i've managed to cross paths with so many other fans with this (i definitely thought it was gonna be one of my less popular codes and i'm very happy to have been proved wrong lol), it's such an underappreciated game!!! good luck on your hunter run!! :D

absolutely beautiful use of rain world's graphics, aesthetics, and room layout to frame the main text! i don't often see a lot of rain world fans so it's great to see people making codes for it!!

thank you so much!!! rain world's my favorite game and i ADORE its whole aesthetic so i knew i had to try translating it into a code :D i'm glad so many people are appreciating it!! <3

HOLY SHIT THIS IS AWESOME AAAAAAAA

God the vibes are immaculate. I love Rain World so much, I'm so glad to find this!

I do have a question though. I have literally 0 coding knowledge and have no idea how to add the lines that make the karma buttons darken when inactive. Where does that go, and what should it look like when it's working?

AJASKHADF thank you so much, i'm glad you like it!!! :D the darkened inactive karma buttons & the other hover/active effects are CSS code (not HTML), and CSS is a premium-exclusive feature on toyhouse, so unfortunately you won't be able to use it since you aren't a premium user (currently). if you do have premium, an additional "CSS" dropdown box shows up under the main HTML box and above the "Advanced" dropdown box, which is where you would put it.

i wanted to keep this layout mostly HTML-only so it'll still look/work nearly the same without it, it's just those hover/active effects that won't be there, since they're unfortunately impossible with pure HTML. :[ sorry!!

Oh alright, I didn't understand that before. Thanks for the explanation! ^w^

Coding is something I'd love to get more into, since spicing up my profiles would be pretty fun.

of course!! :D i think coding (HTML/CSS or otherwise) is super fun once you really get into it, if you're looking for any good resources to get you started here's some i recommend!:

  • w3schools: has good references & simple tutorials overall, i come back to this one a lot!
  • sololearn: beginner-friendly interactive tutorials, good jumping-off point. if you've ever used duolingo it's kinda like that but for coding!
  • bootstrap 4.6 documentation: documentation for the CSS framework toyhouse uses, basically tells you what all the words inside class="" here do.
  • circlejourney's toyhouse live code editor: shows your changes live onscreen as you make them, so you don't have to save every time you want to see what you did.

Thank you so much, these are awesome!

WOAH HOLY SHIT????!!? /VPOS

THIS LOOKS SO AWESOME 

AAAAAHGJAGHA THANK YOU SM!!!!!! ❤️❤️

NPNPNNPNPNP!11 IM DEF USING THIS ONCE IVE FINISHED THE ARTFOR THE OCS  

WOOOGH This looks amazing!

AAAAHAAAHHGGGH THANK YOU SM!!!!! :D

AAASAJALSHFJASHJAAAARRGHGHHHGRHHRRRAAAAAAAAA /VERY POS

RRARAAAAAGGAHAAGAA5AARTRAAAEATARDAERAAEAADAA RAIN WORLD!!!!!!!!!!!!!!!

uppy.gif

yoooo rad!! i’m gonna have to poke at this later, it’s very clean and pretty. good vibes for sure, might end up inspiring me to write down more of the oc info living in my brain 

AAAAAAAAKAJHAGAFH THANK YOU SO MUCH!!!! :D i'm glad you like it!!!

i have poked at it, it's very intuitive even without knowing the coding language, thanks for such a pretty and easy to use template!!! deffo going to take the time to throw this onto all my rw ocs :]!

AAH super glad to hear that, thanks!!!! :D 💖💞

This user is not visible to guests.

AAAARRRRGRGGAGGAGAGAHAGAHRRGRRHRGRHGRHRGRHGRGRGRHRHGAAAAAAGAGRGRHGRRR RAIN WORLD‼️‼️‼️‼️‼️‼️‼️‼️