What's new

Resource ✱⁞EGOMAMA _freebs

Which freebie should I put up next?

  • #1 Sapporo

    Votes: 4 26.7%
  • #2 Cyril

    Votes: 2 13.3%
  • #3 Pokemon

    Votes: 9 60.0%

  • Total voters
    15
  • Poll closed .
#1
EVERYTHING IN THIS THREAD IS FREE FOR USE, BUT PLEASE KEEP THESE RULES IN MIND

O1 DO NOT REPOST THEM AS YOUR WORK WITHOUT ANY CHANGES.

O2 YOU MAY USE THEM AS A BASE FOR YOUR OWN WORK, AS LONG AS CREDIT IS PROVIDED. (INVISIBLE CREDIT IS FINE!)

O3 IF I SPECIFICALLY REQUEST THAT THE CODE REMAIN LARGELY UNALTERED, THERE’S USUALLY A GOOD REASON FOR IT. I DON’T WANT TO GET IN TROUBLE FOR YOUR MISTAKES.
 
Last edited:
#2

x

I kinda got lazy halfway; I'll probably update it one my finals are over. :x This is based on one of my super old codes from when I was new on RPN. It's been updated to generally look better + mobile compatibility. I don't recommend changing the tab titles from the 01, 02... If you still want to, keep them short or you'll probably end up with an ugly surprise. LOL

The tab contents are scrollable, so you can keep writing to your heart's content

I also highly recommend using @Lyro's bbcode editor, as it will make filling this code out much easier. If you happen to use it, just use the BBXML link! You can then just plug in the relevant data via the parameters I set.


That's all! You can preview the code below.




NOTHING
NOTHING
title thing
NOTHING
private message
add as friend
invite to group
report user
block user
name im guessing
  • name: about
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vehicula a nunc varius rhoncus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed congue porttitor egestas. Duis lacinia, felis sit amet pulvinar eleifend, diam augue pharetra felis, eget euismod nunc metus non nisl. Nulla purus tellus, aliquet vel bibendum at, vulputate sed urna. Mauris laoreet elit a blandit molestie. Aenean ac tellus libero. Fusce cursus ipsum quis dui posuere rhoncus.

    Phasellus eu lorem eu lacus suscipit auctor at eu urna. Vestibulum tempor diam neque, nec vulputate turpis hendrerit ut. Cras sed metus nec quam sollicitudin luctus. Curabitur sit amet mi scelerisque, malesuada tortor a, bibendum arcu. Cras a ante vel urna condimentum mollis. Phasellus ac urna ultricies, finibus dolor vel, consectetur elit. Etiam nec quam vel arcu iaculis congue non in lacus. Sed ante tellus, tristique in massa et, porttitor mollis leo. Mauris et sem condimentum, consectetur sem et, venenatis tortor. Curabitur venenatis ultrices posuere.

    Suspendisse mauris augue, tincidunt quis finibus id, cursus et nulla. Morbi iaculis vel eros sed tristique. Proin scelerisque augue sit amet elit venenatis placerat. Suspendisse lobortis finibus libero, eget ullamcorper mi mattis non. Duis mattis ligula non odio imperdiet, in molestie magna fermentum. Vestibulum quam eros, posuere at erat semper, auctor consequat enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Maecenas a lectus dolor. Donec a metus at mi maximus blandit. Donec ullamcorper auctor congue. Maecenas consectetur dignissim neque euismod condimentum. Quisque enim justo, faucibus sit amet vestibulum eget, semper in massa.
    empty
NOTHING
crimson tabs
BASE CODE BY SUGARVINE.
 
Last edited:
#3

x

Hello friends! I'll be releasing the CS code for my character, Ueno Shiori. This format is not mobile compatible due to the nature of the tab coding used.

All five tabs are customizable, and once again I continue to advocate the use of @Lyro's BBXML. Why? All the information is set in neat paramaters that will make it easy to fill out. If you know your way around code, it's an easy matter to delete the image that prefixes the information. To change the image files, just find the the URL for placehold.it as that's what I used.

The fourth tab was meant to be a relationships tab, so feel free to delete that if you'd rather not have one.


That's all! Below is the blank slate version. You can view a filled out variation here.




sugarvine
sugarvine
THIS FORMAT IS NOT MOBILE COMPATIBLE
sugarvine
  • INFO1x ??
    INFO2x ????
    INFO3x pls
    INFO4x just
    INFO5x let
    INFO6x me
    INFO7x live

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque viverra tortor nec erat pharetra laoreet. Integer in eros id erat ultricies iaculis quis sed erat. Vestibulum quis viverra orci. Nam fringilla laoreet purus, eget ullamcorper nisl sagittis nec. Praesent vitae massa felis. Etiam ut enim ex. Quisque a lacus nulla. Pellentesque porttitor varius libero nec gravida. Proin eu eleifend urna. Nam ornare elit vitae dolor imperdiet malesuada. Maecenas ut neque sit amet erat pulvinar rutrum. Donec tristique urna ut dui hendrerit, sit amet pellentesque risus ultrices. Donec pretium pellentesque nunc, ac gravida urna placerat ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam sollicitudin pulvinar metus, quis tempor nisi congue in.
TAB1
TAB2
TAB3
TAB4
TAB5
sugarvine
 
Last edited:
#4

x

I've been working on this since mid-December, hoping to release it in time for Christmas. Unfortunately, I'm way late, but hopefully you'll all still enjoy this. As per usual, you are free to edit and customize it to your liking. But we won't stop at just code! If you want the same effect with your images, I'll be providing a zip file with the coloring psd file + both the bbcode and bbxml versions on my google drive. Obviously, you'll need a version of photoshop for it to be of use to you.


Now let's talk about the design. It's fully mobile compatible (!!!) through the use of flexboxes and calc machinations. While the code is admittedly complicated, it's very customizable once you get over the learning curve. I've actually designed it so that a person can easily add more tabs once they've understood the code. Most points that require some rather specific instructions are denoted with a /*INFO HERE*/, so just hunt those down if you're finding it difficult to find the image slots for example. For the large image and the small square on tab 1, the texture is already there, you just need to replace the right background url.

For clarification, I literally just copypasted I-No's information from the GG wiki. Thanks!

View a colored variation on my showcase thread so you can check out how you can customize it to your own preferences. That's pretty much it!







xxxx
  • BASICS
    I CAN'T HIDE MY AVERTED GAZE
    WHAT'S REALLY TRUE.
    I-NO
    STRENGTH
    /*strength*/
    DEFENSE
    /*defense*/
    MAGIC
    /*magic*/
    RESISTANCE
    /*resistance*/
    AGILITY
    /*agility*/
    DEXTERITY
    /*dexterity*/
    LUCK
    /*luck*/
    I-No has black hair in a bob cut, and has red lips and a mole on her right cheek. I-no wears a red witch hat that has a skull face on it. She wears black leather choker around her neck with a gold ring that is connected to her shoulderless red jacket that she can easily take off and put on. She has a red mini skirt and thigh high heel boots with black panties underneath as seen during some of her attacks. Despite having green eyes in her artworks, her profiles state that her eyes change color "depending on the angle", and are said to be multi-colored. This was not shown in-game until Xrd in which her eyes shift color constantly.
    イノ
01
02
03
04
 
#14

x

Something I designed and coded all within around roughly 12 hours, which is pretty fast for me. Submitted for this prompt. Check it out if you have time!


Having the "runaround" text change color smoothly upon hover was probably the trickiest part of this, as the rest are basic scripts/tabs. I basically positioned an invisible colored version right on top of it, and depending on the bar you hover over, the appropriate color will show up. Changing the colors can be done, you just need to find and replace the appropriate colors, which can be found on the prompt linked above. There are only two images: the bg and the picture to the left. The "profile pic" is just a normal image tag with pointer-events: none on it.

I also specifically designed this with other people in mind. To help out those who aren't quite BBCode fluent, if you want to add more textblocks, just copy paste the code below into the appropriate tab. I coded the script to auto-apply the right color class onto it. That was very tedious to do, but oh well. As for how to make line breaks, add [br][/br] to the appropriate section. That's an empty tag, so you don't put anything in between them.

[div class=textblock][div class=number]##[/div][div class=postbg][div class=subtitle][b]subtitle here[/b][div class=smalltext]lyrics lyrics lyrics[/div][/div]Vivamus nulla velit, vestibulum vel risus ut, lacinia fringilla tellus. Nulla dignissim, turpis non imperdiet hendrerit, ante justo auctor est, sodales ornare sapien nunc nec libero. Proin tellus quam, molestie ac convallis eu, ullamcorper a ipsum. Vestibulum imperdiet placerat sodales. Suspendisse faucibus iaculis elit, eget finibus orci ultrices ut. Curabitur id tortor diam. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sed ex tempor, aliquet tortor pulvinar, molestie libero. Donec a lacus sed orci pulvinar scelerisque. Aliquam vel orci elit.[/div][/div]


font callfont call
pinktab
orangetab
yellowtab
greentab
cyantab
RUNAROUND
RUNAROUND
RUNAROUND
RUNAROUND
RUNAROUND
RUNAROUND
01
basic information
LYRICS
▎ FULL NAME
▎ AGE (##)
▎ GENDER​
02
appearance
lyrics lyrics
physical description here, inclusive of things like manners, demeanor, fashion sense, etc.
03
personality
lyrics lyrics lyrics
Vivamus nulla velit, vestibulum vel risus ut, lacinia fringilla tellus. Nulla dignissim, turpis non imperdiet hendrerit, ante justo auctor est, sodales ornare sapien nunc nec libero. Proin tellus quam, molestie ac convallis eu, ullamcorper a ipsum. Vestibulum imperdiet placerat sodales. Suspendisse faucibus iaculis elit, eget finibus orci ultrices ut. Curabitur id tortor diam. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sed ex tempor, aliquet tortor pulvinar, molestie libero. Donec a lacus sed orci pulvinar scelerisque. Aliquam vel orci elit.

Nulla facilisi. Sed at pellentesque neque, sit amet dictum felis. Morbi commodo auctor ante eget condimentum. Curabitur ac est vitae nulla hendrerit vulputate. In vitae tempus diam. Nunc a risus ac orci tristique dictum a in risus. Pellentesque sagittis tellus turpis, ac sollicitudin erat dapibus accumsan. Suspendisse non ornare sapien. Vestibulum non vehicula lectus. Cras condimentum euismod massa, ac eleifend eros porta scelerisque. Aliquam cursus euismod augue, non finibus arcu facilisis vitae. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin auctor nulla mi, sit amet maximus lorem ornare eget. Fusce non leo ultricies lorem interdum eleifend vel vel leo. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam nec aliquam nunc, vel lobortis odio.
04
preferences
lyrics lyrics lyrics
qjkehkeh
05
history
lyrics lyrics
Aliquam erat volutpat. Proin fermentum venenatis lacus, et faucibus enim auctor vel. Suspendisse non nunc eget urna tincidunt volutpat. Cras ac metus quis elit interdum luctus in quis nulla. Quisque neque elit, aliquam quis lacus nec, auctor viverra libero. Phasellus iaculis a enim quis blandit. In consequat mauris sagittis bibendum congue. Quisque et sagittis eros. Integer odio diam, vestibulum et auctor ut, mattis ut felis. Suspendisse ullamcorper faucibus nisl, feugiat dignissim tortor varius id.

Mauris pretium dui in dolor pretium vestibulum. Nulla rhoncus diam quis diam lacinia, in pellentesque elit blandit. Curabitur in tincidunt tellus. Suspendisse vitae lectus vel neque egestas blandit at et magna. Morbi eget ornare nulla. Mauris justo purus, maximus et arcu a, rhoncus mattis lacus. Praesent pellentesque, nibh nec convallis ultrices, nisi sem iaculis risus, et aliquet leo metus sed nibh. Duis sit amet felis quam. Cras faucibus dolor enim, eu dapibus dolor dignissim eget. Nam venenatis rutrum facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse potenti. Proin vel nulla congue, tristique metus pharetra, posuere mi. Proin eget interdum odio, eu finibus est.
06
miscellaneous
lyrics lyrics
qeqee
01
name here
THE IDIOT THAT KEEPS ON GIVING
insert relationship description here
02
name here
THE ASSHAT THAT LIKES CATS
insert relationship description here
03
name here
THE PRICK THAT NEEDS A REALITY CHECK
insert relationship description here
 
Last edited:
#15

x

Had a strange urge to do something pastel. Rather than fight it, I rolled with it. Fully mobile compatible once again.


Most of the instructions are already in the code itself. It's honestly not a very fancy code; I just really wanted to work with pastel colors. Changing colors should be a breeze. You'll find the two main colors in the very first class' background, as I used as CSS gradient. There's a lot more room for additional customization though! You could probably add a really cool effect when hovering over the "profile pic", or clicking it may cause something to come out. idk. You'll just need to remove the pointer-events: none on it. Also, the octagonal shape is automatic as long as you replace the correct image. That's p much it.


font call font call
ALYANNA
THE BEST THINGS IN LIFE COME IN PASTEL
hello you can put text here. if you'd like a linebreak, add [br][/br]. this is an empty tag, so don't put anything between them.
title here
you can use the title class to add a heading to each post. due to how it's coded, it will be automatically smaller than the name to the left to indicate hierarchy.
put new posts for tab1 above this div!
if you'd like to add an image, make sure to wrap it like [div class=image][img]this[/img][/div], as that runs it through filters to match the design. it also removes the gutter underneath.
put new posts for tab2 above this div!
auto-filter
all images as slightly desaturated and brightened automatically; when hovering over a post, one can see the true colors. the trade off is that clicking on the image triggers the view large image. if you'd rather have it disabled, add a pointer-events: none to the image class. unfortunately, this will also disable the hover effect.
auto-filter
all images as slightly desaturated and brightened automatically; when hovering over a post, one can see the true colors. unlike most of my codes, clicking on the image will enable click to view larger version. if you'd rather have it disabled, add pointer-events: none; to [class name="image"]. unfortunately, this will also disable the hover effect.
auto-filter
all images as slightly desaturated and brightened automatically; when hovering over a post, one can see the true colors. unlike most of my codes, clicking on the image will enable click to view larger version. if you'd rather have it disabled, add pointer-events: none; to [class name="image"]. unfortunately, this will also disable the hover effect.
put new posts for tab3 above this div!
title here
put new posts for tab4 above this div!
artist
i used hakusai's images for this sample
put new posts for tab4 above this div!
1
2
3
4
5
 

Users Who Are Viewing This Thread (Users: 1, Guests: 0)

Top