christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
glad you like it!
-
When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!
Remember to credit artists when using work not your own.
Accepting Requests ๐ฐ๐ต๐ฟ๐ถ๐๐๐ โงพ ๐ฐ๐ผ๐ป๐๐๐ฒ๐น๐น๐ฎ๐๐ถ๐ผ๐ปโฒ๐ ๐ฐ๐ฟ๐ถ๐๐ฝ๐ ๐ฐ๐ผ๐ฑ๐ฒ๐ โช๐ฐ๐น๐ผ๐๐ฒ๐ฑโซ
- Thread starter christy
- Start date
Ayama
Enthusiast
[class=image]width: 150px; height: 150px; background: url(https://cdn.discordapp.com/attachments/628281887613255680/632931907436412929/image1.jpg); background-size: cover; border-radius: 100% 100% 0% 100%;[/class] [class=number]width: 100%; height: 100%; border-radius: 100% 100% 0% 100%; opacity: 0; color: #fff; text-align: center; transition: 1s;[/class] [class=link] display: inline-block; color: #a69deb; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s;[/class] [class name=image state=hover]transition: 1s; filter: grayscale(100%);[/class] [class name=number state=hover]opacity: 1; transition: 1s; background-color: rgba(0,0,0,0.5);[/class] [class name=link state=hover]color: #5f53b5; transition: 1s;[/class][/div][/div][/div]constellation's code[div class=image][div class=number]18efflorescence ; [div class=link]codehttps://textuploader.com/1oaci/rawAyama ; your request is complete! the colour of the floral background on the right can be changed, as long as you do not touch the url link. feel free to change any fonts and colours! i hope you like it, and thank you for being patient to anybody who would like to use this code - feel free to change the tab names to whatever you would like. if you have any questions, don't be afraid to message me! the raw code can be found when you hover over the word 'code' and please do not remove the credit, thank you!
[class=outline]padding: 2vh; width: 900px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important;[/class] [class=leftborder]position: absolute; height: 450px; width: 450px; background-color: #e8e8e8;[/class] [class=rightborder]position: absolute; margin-left: 450px; height: 450px; width: 450px; background-color: #831b28; background-image: url(https://www.transparenttextures.com/patterns/xv.png);[/class] [class=title]font-size: 50px; color: white; text-transform: lowercase; font-family: 'Merriweather'; line-height: 50px; transform: rotate(-10deg); text-align: left;[/class] [class=container]position: absolute; margin-top: 75px; margin-left: 80px; height: 300px; width: 550px; background: #fff;[/class] [class=sideinfo]margin-left: 200px; margin-top: 110px; width: 230px; font-size: 14px; color: #fff; white-space: pre-line; font-family: 'Merriweather Sans'; text-align: right;[/class] [class=tabs]height: 9px; width: 320px; margin-top: 25px; margin-left: 105px; border-top-left-radius: 15px; border-bottom-left-radius: 15px; background: linear-gradient(90deg, rgba(131,27,40,1) 0%, rgba(232,232,232,1) 90%); padding: 8px 20px;[/class] [class=tab]font-size: 9px; height: 25px; text-transform: uppercase; color: black; font-weight: 400; letter-spacing: 0.5px; font-family: 'Merriweather Sans'; transition: 0.5s;[/class] [class=chosentab]color: #fff; transform: translateY(-5px); letter-spacing: 1.5px;[/class] [class=content]padding: 20px 0 20px 20px; height: 260px; width: 525px; overflow: hidden; font-size: 12px; text-align: justify; white-space: pre-line;[/class] [class=scroll]width: 100%; height: 100%; overflow-y: scroll; box-sizing: content-box; padding-right: 20px; font-family: 'Merriweather Sans';[/class] [class=tag]border-bottom: 6px #831b28 solid; line-height: 4px; text-transform: lowercase; font-size: 14px; letter-spacing: -1px; color: #111; display: inline-block; font-family: 'Merriweather';[/class] [class=tag2]color: #fff; text-transform: lowercase; font-size: 20px; letter-spacing: -1px; display: inline-block; font-family: 'Merriweather';[/class] [class name=tab state=hover] color: #fff; transform: translateY(-5px); transition: all 0.5s; letter-spacing: 1.5px; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [script class=tab1 on=click] hide tabsContent2 hide tabsContent3 hide tabsContent4 hide tabsContent5 fadeToggle 500 tabsContent1 addClass chosentab removeClass chosentab tab2 removeClass chosentab tab3 removeClass chosentab tab4 removeClass chosentab tab5[/script] [script class=tab2 on=click] hide tabsContent1 hide tabsContent3 hide tabsContent4 hide tabsContent5 fadeToggle 500 tabsContent2 addClass chosentab removeClass chosentab tab1 removeClass chosentab tab3 removeClass chosentab tab4 removeClass chosentab tab5[/script] [script class=tab3 on=click] hide tabsContent1 hide tabsContent2 hide tabsContent4 hide tabsContent5 fadeToggle 500 tabsContent3 addClass chosentab removeClass chosentab tab1 removeClass chosentab tab2 removeClass chosentab tab4 removeClass chosentab tab5[/script] [script class=tab4 on=click] hide tabsContent1 hide tabsContent2 hide tabsContent3 hide tabsContent5 fadeToggle 500 tabsContent4 addClass chosentab removeClass chosentab tab1 removeClass chosentab tab2 removeClass chosentab tab3 removeClass chosentab tab5[/script] [script class=tab5 on=click] hide tabsContent1 hide tabsContent2 hide tabsContent3 hide tabsContent4 fadeToggle 500 tabsContent5 addClass chosentab removeClass chosentab tab1 removeClass chosentab tab2 removeClass chosentab tab3 removeClass chosentab tab4[/script] [div class=outline][div class=leftborder][div class=tabs][div class="tab tab1 chosentab"]home[div class="tab tab2"]appearance[/div] [div class="tab tab3"]abilities[/div] [div class="tab tab4"]personality[/div] [div class="tab tab5"]history[/div][/div][/div][/div] [div class=rightborder][div class=sideinfo][div class=title]namehere.[/div] [div class=tag2]age.[/div] here [div class=tag2]gender.[/div] here [div class=tag2]orientation.[/div] here[/div][/div] [div class=container][div class="tabsContent tabsContent1"][/div] [div class="tabsContent tabsContent2" style="display: none;"][div class=content][div class=scroll][div class=tag]title here.[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit. [div class=tag]title here.[/div] Quisque interdum lobortis consectetur. Nullam lorem risus, suscipit vitae suscipit non, eleifend a eros. Aenean sed purus purus. [div class=tag]title here.[/div] Nulla fringilla eu turpis et fringilla. Aenean elementum massa ullamcorper, rhoncus orci eget, placerat mi. Aliquam erat volutpat. Mauris eget ex sit amet ex blandit tristique. Praesent sed erat dolor. Donec rhoncus sapien ac tellus aliquam, at interdum libero tincidunt. Nam rutrum nisi a libero vulputate, id varius mauris suscipit. Praesent ut felis at lacus ullamcorper tempus. Nunc et mattis ex. Aenean venenatis, velit tempor accumsan posuere, purus velit lacinia nisi, molestie commodo velit dui in urna. Vivamus sed imperdiet sem. Curabitur eget lorem commodo, malesuada sapien ut, venenatis est. Phasellus sit amet nibh elit. Sed faucibus fringilla tristique. Suspendisse consectetur purus vitae sapien maximus, a porta purus feugiat. Mauris eleifend congue libero quis vehicula. Pellentesque pulvinar urna eget rhoncus tristique. Curabitur vestibulum velit eget dignissim dignissim. Duis diam orci, tempor volutpat iaculis id, tincidunt quis sapien. Nam lobortis leo urna, at eleifend elit vulputate vitae. Suspendisse a augue fringilla, vulputate arcu hendrerit, luctus quam. Etiam tempus hendrerit purus eu fringilla. Etiam ullamcorper ipsum eu ante maximus, id bibendum tellus ultrices. Integer sodales massa at risus tincidunt accumsan.[/div][/div][/div] [div class="tabsContent tabsContent3" style="display: none;"][div class=content][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque interdum lobortis consectetur. Nullam lorem risus, suscipit vitae suscipit non, eleifend a eros. Aenean sed purus purus. Nulla fringilla eu turpis et fringilla. Aenean elementum massa ullamcorper, rhoncus orci eget, placerat mi. Aliquam erat volutpat. Mauris eget ex sit amet ex blandit tristique. Praesent sed erat dolor. Donec rhoncus sapien ac tellus aliquam, at interdum libero tincidunt. Nam rutrum nisi a libero vulputate, id varius mauris suscipit. Praesent ut felis at lacus ullamcorper tempus. Nunc et mattis ex. Aenean venenatis, velit tempor accumsan posuere, purus velit lacinia nisi, molestie commodo velit dui in urna. Vivamus sed imperdiet sem. Curabitur eget lorem commodo, malesuada sapien ut, venenatis est. Phasellus sit amet nibh elit. Sed faucibus fringilla tristique. Suspendisse consectetur purus vitae sapien maximus, a porta purus feugiat. Mauris eleifend congue libero quis vehicula. Pellentesque pulvinar urna eget rhoncus tristique. Curabitur vestibulum velit eget dignissim dignissim. Duis diam orci, tempor volutpat iaculis id, tincidunt quis sapien. Nam lobortis leo urna, at eleifend elit vulputate vitae. Suspendisse a augue fringilla, vulputate arcu hendrerit, luctus quam. Etiam tempus hendrerit purus eu fringilla. Etiam ullamcorper ipsum eu ante maximus, id bibendum tellus ultrices. Integer sodales massa at risus tincidunt accumsan.[/div][/div][/div] [div class="tabsContent tabsContent4" style="display: none;"][div class=content][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque interdum lobortis consectetur. Nullam lorem risus, suscipit vitae suscipit non, eleifend a eros. Aenean sed purus purus. Nulla fringilla eu turpis et fringilla. Aenean elementum massa ullamcorper, rhoncus orci eget, placerat mi. Aliquam erat volutpat. Mauris eget ex sit amet ex blandit tristique. Praesent sed erat dolor. Donec rhoncus sapien ac tellus aliquam, at interdum libero tincidunt. Nam rutrum nisi a libero vulputate, id varius mauris suscipit. Praesent ut felis at lacus ullamcorper tempus. Nunc et mattis ex. Aenean venenatis, velit tempor accumsan posuere, purus velit lacinia nisi, molestie commodo velit dui in urna. Vivamus sed imperdiet sem. Curabitur eget lorem commodo, malesuada sapien ut, venenatis est. Phasellus sit amet nibh elit. Sed faucibus fringilla tristique. Suspendisse consectetur purus vitae sapien maximus, a porta purus feugiat. Mauris eleifend congue libero quis vehicula. Pellentesque pulvinar urna eget rhoncus tristique. Curabitur vestibulum velit eget dignissim dignissim. Duis diam orci, tempor volutpat iaculis id, tincidunt quis sapien. Nam lobortis leo urna, at eleifend elit vulputate vitae. Suspendisse a augue fringilla, vulputate arcu hendrerit, luctus quam. Etiam tempus hendrerit purus eu fringilla. Etiam ullamcorper ipsum eu ante maximus, id bibendum tellus ultrices. Integer sodales massa at risus tincidunt accumsan.[/div][/div][/div] [div class="tabsContent tabsContent5" style="display: none;"][div class=content][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque interdum lobortis consectetur. Nullam lorem risus, suscipit vitae suscipit non, eleifend a eros. Aenean sed purus purus. Nulla fringilla eu turpis et fringilla. Aenean elementum massa ullamcorper, rhoncus orci eget, placerat mi. Aliquam erat volutpat. Mauris eget ex sit amet ex blandit tristique. Praesent sed erat dolor. Donec rhoncus sapien ac tellus aliquam, at interdum libero tincidunt. Nam rutrum nisi a libero vulputate, id varius mauris suscipit. Praesent ut felis at lacus ullamcorper tempus. Nunc et mattis ex. Aenean venenatis, velit tempor accumsan posuere, purus velit lacinia nisi, molestie commodo velit dui in urna. Vivamus sed imperdiet sem. Curabitur eget lorem commodo, malesuada sapien ut, venenatis est. Phasellus sit amet nibh elit. Sed faucibus fringilla tristique. Suspendisse consectetur purus vitae sapien maximus, a porta purus feugiat. Mauris eleifend congue libero quis vehicula. Pellentesque pulvinar urna eget rhoncus tristique. Curabitur vestibulum velit eget dignissim dignissim. Duis diam orci, tempor volutpat iaculis id, tincidunt quis sapien. Nam lobortis leo urna, at eleifend elit vulputate vitae. Suspendisse a augue fringilla, vulputate arcu hendrerit, luctus quam. Etiam tempus hendrerit purus eu fringilla. Etiam ullamcorper ipsum eu ante maximus, id bibendum tellus ultrices. Integer sodales massa at risus tincidunt accumsan.[/div][/div][/div]coded by[/div][/div]constellation.
It's goooooorgeous! Thank you so much! >w<
constellation
๐บ ๐๐๐๐๐ ๐๐๐บ๐
ahhh it's no problem, i'm glad you like it c:
thank you again for giving me the freedom to design!
Ayama
Enthusiast
Let's face it- you're the expert at making pretty things here!
It'd be silly to ask someone more skilled and talented than you are to make something for you and then not let them use said skill and talent xD
It'd be silly to ask someone more skilled and talented than you are to make something for you and then not let them use said skill and talent xD
constellation
๐บ ๐๐๐๐๐ ๐๐๐บ๐
eeee i try my best xD
but thank you for having confidence in me
Ayama
Enthusiast
Well it's true ;P
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
[class=image]
width: 150px;
height: 150px;
background: url(https://i.pinimg.com/564x/ff/01/10/ff01106474b0c488d4671c6cb7699b80.jpg);
background-size: cover;
border-radius: 100% 100% 0% 100%;
[/class]
[class=number]
width: 100%;
height: 100%;
border-radius: 100% 100% 0% 100%;
opacity: 0;
color: #fff;
text-align: center;
transition: 1s;
[/class]
[class=link2]
display: inline-block;
color: #a69deb;
cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
transition: 1s;
[/class]
[class name=image state=hover]
transition: 1s;
filter: grayscale(100%);
[/class]
[class name=number state=hover]
opacity: 1;
transition: 1s;
background-color: rgba(0,0,0,0.5);
[/class]
[class name=link2 state=hover]
color: #5f53b5;
transition: 1s;
[/class]
[/div][/div][/div]
[class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin-top: 10px; padding: 1px 1px 2px 1px; font-family: Playfair Display; font-weight: bold; color: #333; font-size: 12px; border-bottom: 1px solid #d69754; margin-right: 3px; [/class] [class=tag3] display: inline; margin-top: 10px; padding: 1px 5px 3px 5px; font-family: Playfair Display; color: #000; border: 1px solid #d69754; background: #fff; border-radius: 5px; font-size: 10px; [/class] [class=home] color: #fff; width: 60px; height: 60px; margin: auto; box-sizing: border-box; background: #000; padding-top: 5px; border-radius: 100%; border: 1px solid #000; font-size: 25px; text-align: center; font-weight: bold; text-transform: uppercase; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: all 1s; [/class] [class name=home state=hover] color: #d69754; transition: all 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tab] box-sizing: border-box; background: #fff; border-radius: 5px; border: 1px solid #000; padding: 1px 5px 1px 5px; display: inline; color: #000; text-align: center; transition: all .5s; font-size: 12px; font-family: Avenir; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class name=tab state=hover] color: #d69754; border: 1px solid #d69754; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tabContents] position: absolute; opacity: 0; transition: all 1s; width: 294px; font-size: 11px; line-height: 26px; background: #fff; color: #000; height: 400px; box-sizing: border-box; [/class] [class=show] opacity: 1; z-index: 1; [/class] [script class=tab1 on=click] addClass show tabContents01 removeClass show tabContents07 [/script] [script class=home on=click] addClass show tabContents07 removeClass show tabContents01 [/script]
[div class=tag3]location info.
[div class=tag3]outfit info.
[div class=tag3]interactions info.
[div class=tag3]tags[/div] info. [/div] [/div]
christy's code
[div class=image][div class=number]
19
royal orchid ; [div class=link2]code
https://pastebin.com/raw/Jd5NSCRHthis is an ic code freebie! it's pretty simple, and has two tabs โ one is the 'read more' tab which reveals the ic text, and the other is the home button in the circle which will take you back to the home page once 'read more' has already been clicked on. 'br' tags are necessary for line and paragraph breaks and the colours can definitely be changed! this is unfortunately not mobile friendly. if you have any questions regarding the use of the code, feel free to message me!
[class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin-top: 10px; padding: 1px 1px 2px 1px; font-family: Playfair Display; font-weight: bold; color: #333; font-size: 12px; border-bottom: 1px solid #d69754; margin-right: 3px; [/class] [class=tag3] display: inline; margin-top: 10px; padding: 1px 5px 3px 5px; font-family: Playfair Display; color: #000; border: 1px solid #d69754; background: #fff; border-radius: 5px; font-size: 10px; [/class] [class=home] color: #fff; width: 60px; height: 60px; margin: auto; box-sizing: border-box; background: #000; padding-top: 5px; border-radius: 100%; border: 1px solid #000; font-size: 25px; text-align: center; font-weight: bold; text-transform: uppercase; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: all 1s; [/class] [class name=home state=hover] color: #d69754; transition: all 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tab] box-sizing: border-box; background: #fff; border-radius: 5px; border: 1px solid #000; padding: 1px 5px 1px 5px; display: inline; color: #000; text-align: center; transition: all .5s; font-size: 12px; font-family: Avenir; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class name=tab state=hover] color: #d69754; border: 1px solid #d69754; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tabContents] position: absolute; opacity: 0; transition: all 1s; width: 294px; font-size: 11px; line-height: 26px; background: #fff; color: #000; height: 400px; box-sizing: border-box; [/class] [class=show] opacity: 1; z-index: 1; [/class] [script class=tab1 on=click] addClass show tabContents01 removeClass show tabContents07 [/script] [script class=home on=click] addClass show tabContents07 removeClass show tabContents01 [/script]
[div class=home]
[div class=tag3]mood
info.
[div class=tag3]location
[div class=tag3]outfit
[div class=tag3]interactions
[div class=tag3]tags[/div] info. [/div] [/div]
[div class="tabContents tabContents07 show"]
[/div]
[div class="tabContents tabContents01"]
the
is
role
is
here
[div class="tab tab1"]read more
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit
[/div]
[/div]
[/div]
[/div][/div]
https://www.rpnation.com/threads/๐ฐ๐ต๐ฟ๐ถ๐๐๐-โงพ-๐ฐ๐ผ๐ป๐๐๐ฒ๐น๐น๐ฎ๐๐ถ๐ผ๐ปโฒ๐-๐ฐ๐ฟ๐ถ๐๐ฝ๐-๐ฐ๐ผ๐ฑ๐ฒ๐.454487/post-9951524[/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit
Last edited:
Luxura
Thirteenth Mystic โฅArt by Peritwinkleโฅ
Hi ladies! 
โ code type Character Placeholder
โ overall size Medium
โ images One Placeholder
โ colours Same as Royal Orchid
โ fonts Same as Royal Orchid
โ any specific details Can it be a matching set to the Royal Orchid IC code? image aligned LEFT, then text next to it. No tabs, just a list: Name:, Race:, Gender:, Alias:, Dossier: I'd also like to be able to have the placeholder image be a future link. Not sure if that's of any importance.
โ coder either! But I suppose Christy since she posted Royal Orchid
โ code type Character Placeholder
โ overall size Medium
โ images One Placeholder
โ colours Same as Royal Orchid
โ fonts Same as Royal Orchid
โ any specific details Can it be a matching set to the Royal Orchid IC code?
image aligned LEFT, then text next to it. No tabs, just a list: Name:, Race:, Gender:, Alias:, Dossier: I'd also like to be able to have the placeholder image be a future link. Not sure if that's of any importance.โ coder either! But I suppose Christy since she posted Royal Orchid
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
[class=image]
width: 150px;
height: 150px;
background: url(https://i.pinimg.com/564x/ff/01/10/ff01106474b0c488d4671c6cb7699b80.jpg);
background-size: cover;
border-radius: 100% 100% 0% 100%;
[/class]
[class=number]
width: 100%;
height: 100%;
border-radius: 100% 100% 0% 100%;
opacity: 0;
color: #fff;
text-align: center;
transition: 1s;
[/class]
[class=link2]
display: inline-block;
color: #a69deb;
cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
transition: 1s;
[/class]
[class name=image state=hover]
transition: 1s;
filter: grayscale(100%);
[/class]
[class name=number state=hover]
opacity: 1;
transition: 1s;
background-color: rgba(0,0,0,0.5);
[/class]
[class name=link2 state=hover]
color: #5f53b5;
transition: 1s;
[/class]
Luxura
; here is your code! i made it to match royal orchid, like you asked. you can feel free to change the colours or the fonts if you wish to do so, and that applies to anyone else using it as a placeholder as well! 'br' tags are necessary for line and paragraph break. this is unfortunately not mobile friendly. if you have any questions regarding the use of the code, feel free to message me!
[/div][/div][/div]
[class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin: auto; padding: 1px 5px 3px 5px; font-family: Playfair Display; color: #000; border: 1px solid #d69754; background: #fff; border-radius: 5px; font-size: 13px; [/class]
info here.
[div class=tag]alias
info here.
[div class=tag]dossier
info here. [/div][/div] [/div] [/div][/div] https://www.rpnation.com/threads/๐ฐ๐ต๐ฟ๐ถ๐๐๐-โงพ-๐ฐ๐ผ๐ป๐๐๐ฒ๐น๐น๐ฎ๐๐ถ๐ผ๐ปโฒ๐-๐ฐ๐ฟ๐ถ๐๐ฝ๐-๐ฐ๐ผ๐ฑ๐ฒ๐.454487/post-9951524[/div]
christy's code
[div class=image][div class=number]
20
royal orchid (ph) ; [div class=link2]code
https://pastebin.com/raw/NAY1kxC8
Luxura
; here is your code! i made it to match royal orchid, like you asked. you can feel free to change the colours or the fonts if you wish to do so, and that applies to anyone else using it as a placeholder as well! 'br' tags are necessary for line and paragraph break. this is unfortunately not mobile friendly. if you have any questions regarding the use of the code, feel free to message me![class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin: auto; padding: 1px 5px 3px 5px; font-family: Playfair Display; color: #000; border: 1px solid #d69754; background: #fff; border-radius: 5px; font-size: 13px; [/class]
info here.
[div class=tag]alias
info here.
[div class=tag]dossier
info here. [/div][/div] [/div] [/div][/div] https://www.rpnation.com/threads/๐ฐ๐ต๐ฟ๐ถ๐๐๐-โงพ-๐ฐ๐ผ๐ป๐๐๐ฒ๐น๐น๐ฎ๐๐ถ๐ผ๐ปโฒ๐-๐ฐ๐ฟ๐ถ๐๐ฝ๐-๐ฐ๐ผ๐ฑ๐ฒ๐.454487/post-9951524[/div]
Last edited:
Luxura
Thirteenth Mystic โฅArt by Peritwinkleโฅ
[class=image] width: 150px; height: 150px; background: url(https://i.pinimg.com/564x/ff/01/10/ff01106474b0c488d4671c6cb7699b80.jpg); background-size: cover; border-radius: 100% 100% 0% 100%; [/class] [class=number] width: 100%; height: 100%; border-radius: 100% 100% 0% 100%; opacity: 0; color: #fff; text-align: center; transition: 1s; [/class] [class=link2] display: inline-block; color: #a69deb; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; [/class] [class name=image state=hover] transition: 1s; filter: grayscale(100%); [/class] [class name=number state=hover] opacity: 1; transition: 1s; background-color: rgba(0,0,0,0.5); [/class] [class name=link2 state=hover] color: #5f53b5; transition: 1s; [/class][/div][/div][/div]christy's code[div class=image][div class=number]20royal orchid (ph) ; [div class=link2]codehttps://pastebin.com/raw/QW4j6wAn
[class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin: auto; padding: 1px 5px 3px 5px; font-family: Playfair Display; color: #000; border: 1px solid #d69754; background: #fff; border-radius: 5px; font-size: 13px; [/class]
info here.
[div class=tag]alias
info here.
[div class=tag]dossier
info here. [/div][/div] [/div] [/div][/div] https://www.rpnation.com/threads/๐ฐ๐ต๐ฟ๐ถ๐๐๐-โงพ-๐ฐ๐ผ๐ป๐๐๐ฒ๐น๐น๐ฎ๐๐ถ๐ผ๐ปโฒ๐-๐ฐ๐ฟ๐ถ๐๐ฝ๐-๐ฐ๐ผ๐ฑ๐ฒ๐.454487/post-9951524[/div]
Thank you Christy!
I will definitely have more for you ladies soon!
I will definitely have more for you ladies soon!
constellation
๐บ ๐๐๐๐๐ ๐๐๐บ๐
[class=image]width: 150px; height: 150px; background: url(https://cdn.discordapp.com/attachments/628281887613255680/632931907436412929/image1.jpg); background-size: cover; border-radius: 100% 100% 0% 100%;[/class]
[class=number]width: 100%; height: 100%; border-radius: 100% 100% 0% 100%; opacity: 0; color: #fff; text-align: center; transition: 1s;[/class]
[class=link] display: inline-block; color: #a69deb; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s;[/class]
[class name=image state=hover]transition: 1s; filter: grayscale(100%);[/class]
[class name=number state=hover]opacity: 1; transition: 1s; background-color: rgba(0,0,0,0.5);[/class]
[class name=link state=hover]color: #5f53b5; transition: 1s;[/class]
[/div][/div][/div]
[class=container]width: 600px; height: 500px; margin: auto;[/class] [class=holder]position: absolute; width: 600px; height: 500px; background-color: #f3f3f3; border-radius: 6px; overflow: hidden;[/class] [class=tabs]position: absolute; top: 0; left: 0; height: 40px; width: 450px;[/class] [class=tab]display: inline-block; height: 20px; font-size: 10px; font-family: montserrat; color: #262626; font-weight: 400; text-transform: uppercase; line-height: 30px; padding: 10px 5px 8px 5px; text-align: center; transition: 1s; border-bottom: 2px solid #dcabab;[/class] [class=nc]color: #bbb; display: inline; transition: 1s;[/class][class=ct]color: #262626; transition: 1s;[/class] [class=tabContents]position: absolute; top: 60px; left: 20px; width: 410px; height: 420px;[class] [class=tabcontainer]width: 410px; height: 420px;[/class] [class=tag]font-size: 10px; font-family: 'montserrat'; text-transform: uppercase; letter-spacing: 1px; color: #8d8d8d; margin-right: auto; text-align: center; display: table; padding: 0 2px; border-bottom: 1px solid #dcabab; margin-bottom: 5px; margin-top: 5px; margin-left: 5px;[/class] [class=ans]margin-left: 15px; text-transform: lowercase; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; display: table; line-height: 110%; margin-right: auto; padding-bottom: 5px; text-align: justify;[/class] [class=tab1top]position: absolute; width: 410px; height: 150px; border-bottom: 1px solid #bbb;[/class] [class=tab1toppic]position: absolute; top: 0; left: 0; height: 130px; width: 200px; background-color: #dcabab; padding: 10px;[/class] [class=tab1topinfo]position: absolute; width: 150px; height: 134px; right: 0; top: 0; padding: 8px 20px; text-align: justify; font-family: montserrat; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #8d8d8d; white-space: pre-line; line-height: 110%;[/class] [class=tab1toptag]margin-left: 10px; text-transform: lowercase; font-family: poppins; font-size: 13px; letter-spacing: -1px; color: #dcabab; display: table; padding-left: 8px; padding-right: 5px; line-height: 110%; margin-top: -4px; margin-bottom: 5px;[/class] [class=tab1bottom]position: absolute; width: 410px; height: 275px; left: 0; top: 150px;[/class] [class=tab1bottominfo]position: absolute; height: 250px; width: 245px; top: 20px; left: 10px; overflow-x: hidden;[/class] [class=tab1bottomtitle]font-weight: 800; text-transform: lowercase; font-size: 30px; letter-spacing: -1px; color: #424242; display: table; border-bottom: 5px solid #dcabab; line-height: 10px; margin-left: auto; margin-top: 10px; margin-bottom: 10px; margin-right: 10px;[/class] [class=tab1bottompics]position: absolute; bottom: 0; right: 0; height: 255px; width: 135px;[/class] [class=tab2slab]width: 220px; height: 20px; line-height: 100%; font-family: montserrat; font-size: 15px; letter-spacing: -1px; background-color: #dcabab; border-radius: 0px 6px 6px 0px; padding-top: 10px; padding-bottom: 10px; padding-right: 15px; text-align: right; color: #262626; text-transform: lowercase; margin-right: auto; margin-left: -20px;[/class] [class=tab2appearance]position: absolute; left: 20px; top: 60px; height: 360px; width: 230px; overflow-x: hidden; padding-right: 10px;[/class] [class=tab3title]position: absolute; height: 22px; line-height: 22px; margin-left: 20px; padding: -1px 2px 4px 2px; background: #dcabab; font-size: 20px; letter-spacing: -1px; color: #262626; text-transform: lowercase; font-family: montserrat; font-weight: 800; text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;[/class] [class=tab3persona]position: relative; width: 407px; height: 105px; border-radius: 6px; border: 1px solid #dcabab; background: white; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; text-align: justify;[/class] [class=tab3container]margin: 10px; height: 85px; width: 382px; overflow-x: hidden; padding-right: 5px; line-height: 110%; white-space: pre-line;[/class] [class=tab4history]position: relative; top: 0; left: 0; height: 228px; width: 408px; border-radius: 6px; border: 1px solid #dcabab; background: white; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; text-align: justify;[/class] [class=tab4container]margin: 10px; height: 208px; width: 383px; overflow-x: hidden; padding-right: 5px; line-height: 110%; white-space: pre-line;[/class] [class=tab4pic]position: absolute; top: 245px; left: 0; height: 155px; width: 390px; background-color: #dcabab; padding: 10px;[/class] [class=tab5container]width: 405px; height: 420px; padding-right: 5px; overflow-x: hidden; white-space: initial;[/class] [class=relationshipbar]height: 160px; width: 388px; border-bottom: 1px solid #bbb; background: white;[/class] [class=relationshipinfo]float: right; height: 120px; width: 185px; text-transform: lowercase; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; line-height: 110%; text-align: justify; overflow: hidden; padding: 10px 0px 10px 20px; white-space: pre-line;[/class] [class=scroll]width: 100%; height: 100%; overflow-y: scroll; padding-right: 20px;[/class] [class=break]display: block; margin-bottom: 15px; font-size: 15px; line-height: 15px;[/class] [class=sideholder]position: absolute; height: 500px; width: 150px; right: 0; top: 0; background-color: #dcabab;[/class] [class=name]width: 500px; font-family: montserrat; font-weight: 800; text-transform: lowercase; font-size: 30px; letter-spacing: -1px; color: #424242; display: table; text-align: center; position: absolute; bottom: -150px; height: 150px; line-height: 150px; padding-bottom: 0px; transform: rotate(-90deg); transform-origin: left top 0; float: left; text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;[/class] [class name="nc" state="hover"] cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #262626; transition: 1s; [/class] [script class=tab1 on=click] hide tabContents02 hide tabContents03 hide tabContents04 hide tabContents05 slideDown 1000 tabContents01 addClass ct nc1 removeClass ct nc2 removeClass ct nc3 removeClass ct nc4 removeClass ct nc5 [/script] [script class=tab2 on=click] hide tabContents01 hide tabContents03 hide tabContents04 hide tabContents05 slideDown 1000 tabContents02 addClass ct nc2 removeClass ct nc1 removeClass ct nc3 removeClass ct nc4 removeClass ct nc5 [/script] [script class=tab3 on=click] hide tabContents01 hide tabContents02 hide tabContents04 hide tabContents05 slideDown 1000 tabContents03 addClass ct nc3 removeClass ct nc1 removeClass ct nc2 removeClass ct nc4 removeClass ct nc5 [/script] [script class=tab4 on=click] hide tabContents01 hide tabContents02 hide tabContents03 hide tabContents05 slideDown 1000 tabContents04 addClass ct nc4 removeClass ct nc1 removeClass ct nc2 removeClass ct nc3 removeClass ct nc5 [/script] [script class=tab5 on=click] hide tabContents01 hide tabContents02 hide tabContents03 hide tabContents04 slideDown 1000 tabContents05 addClass ct nc5 removeClass ct nc1 removeClass ct nc2 removeClass ct nc3 removeClass ct nc4 [/script]
constellation's code
[div class=image][div class=number]
21
pomegranate ; [div class=link]code
https://textuploader.com/1ot75/rawhellooo again. here's a freebie i've been working on for the past couple days!
it's a very big code, but i've separated everything with comments, so hopefully that should help. if you have any questions, please don't be afraid to message me. i'm here to help c:
you can access the raw code when you hover over the word 'code', please don't remove the credit or steal/claim this code as yours butttt i hope you all like it!
[class=container]width: 600px; height: 500px; margin: auto;[/class] [class=holder]position: absolute; width: 600px; height: 500px; background-color: #f3f3f3; border-radius: 6px; overflow: hidden;[/class] [class=tabs]position: absolute; top: 0; left: 0; height: 40px; width: 450px;[/class] [class=tab]display: inline-block; height: 20px; font-size: 10px; font-family: montserrat; color: #262626; font-weight: 400; text-transform: uppercase; line-height: 30px; padding: 10px 5px 8px 5px; text-align: center; transition: 1s; border-bottom: 2px solid #dcabab;[/class] [class=nc]color: #bbb; display: inline; transition: 1s;[/class][class=ct]color: #262626; transition: 1s;[/class] [class=tabContents]position: absolute; top: 60px; left: 20px; width: 410px; height: 420px;[class] [class=tabcontainer]width: 410px; height: 420px;[/class] [class=tag]font-size: 10px; font-family: 'montserrat'; text-transform: uppercase; letter-spacing: 1px; color: #8d8d8d; margin-right: auto; text-align: center; display: table; padding: 0 2px; border-bottom: 1px solid #dcabab; margin-bottom: 5px; margin-top: 5px; margin-left: 5px;[/class] [class=ans]margin-left: 15px; text-transform: lowercase; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; display: table; line-height: 110%; margin-right: auto; padding-bottom: 5px; text-align: justify;[/class] [class=tab1top]position: absolute; width: 410px; height: 150px; border-bottom: 1px solid #bbb;[/class] [class=tab1toppic]position: absolute; top: 0; left: 0; height: 130px; width: 200px; background-color: #dcabab; padding: 10px;[/class] [class=tab1topinfo]position: absolute; width: 150px; height: 134px; right: 0; top: 0; padding: 8px 20px; text-align: justify; font-family: montserrat; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #8d8d8d; white-space: pre-line; line-height: 110%;[/class] [class=tab1toptag]margin-left: 10px; text-transform: lowercase; font-family: poppins; font-size: 13px; letter-spacing: -1px; color: #dcabab; display: table; padding-left: 8px; padding-right: 5px; line-height: 110%; margin-top: -4px; margin-bottom: 5px;[/class] [class=tab1bottom]position: absolute; width: 410px; height: 275px; left: 0; top: 150px;[/class] [class=tab1bottominfo]position: absolute; height: 250px; width: 245px; top: 20px; left: 10px; overflow-x: hidden;[/class] [class=tab1bottomtitle]font-weight: 800; text-transform: lowercase; font-size: 30px; letter-spacing: -1px; color: #424242; display: table; border-bottom: 5px solid #dcabab; line-height: 10px; margin-left: auto; margin-top: 10px; margin-bottom: 10px; margin-right: 10px;[/class] [class=tab1bottompics]position: absolute; bottom: 0; right: 0; height: 255px; width: 135px;[/class] [class=tab2slab]width: 220px; height: 20px; line-height: 100%; font-family: montserrat; font-size: 15px; letter-spacing: -1px; background-color: #dcabab; border-radius: 0px 6px 6px 0px; padding-top: 10px; padding-bottom: 10px; padding-right: 15px; text-align: right; color: #262626; text-transform: lowercase; margin-right: auto; margin-left: -20px;[/class] [class=tab2appearance]position: absolute; left: 20px; top: 60px; height: 360px; width: 230px; overflow-x: hidden; padding-right: 10px;[/class] [class=tab3title]position: absolute; height: 22px; line-height: 22px; margin-left: 20px; padding: -1px 2px 4px 2px; background: #dcabab; font-size: 20px; letter-spacing: -1px; color: #262626; text-transform: lowercase; font-family: montserrat; font-weight: 800; text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;[/class] [class=tab3persona]position: relative; width: 407px; height: 105px; border-radius: 6px; border: 1px solid #dcabab; background: white; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; text-align: justify;[/class] [class=tab3container]margin: 10px; height: 85px; width: 382px; overflow-x: hidden; padding-right: 5px; line-height: 110%; white-space: pre-line;[/class] [class=tab4history]position: relative; top: 0; left: 0; height: 228px; width: 408px; border-radius: 6px; border: 1px solid #dcabab; background: white; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; text-align: justify;[/class] [class=tab4container]margin: 10px; height: 208px; width: 383px; overflow-x: hidden; padding-right: 5px; line-height: 110%; white-space: pre-line;[/class] [class=tab4pic]position: absolute; top: 245px; left: 0; height: 155px; width: 390px; background-color: #dcabab; padding: 10px;[/class] [class=tab5container]width: 405px; height: 420px; padding-right: 5px; overflow-x: hidden; white-space: initial;[/class] [class=relationshipbar]height: 160px; width: 388px; border-bottom: 1px solid #bbb; background: white;[/class] [class=relationshipinfo]float: right; height: 120px; width: 185px; text-transform: lowercase; font-family: 'poppins'; font-size: 12px; letter-spacing: 0px; color: #8d8d8d; line-height: 110%; text-align: justify; overflow: hidden; padding: 10px 0px 10px 20px; white-space: pre-line;[/class] [class=scroll]width: 100%; height: 100%; overflow-y: scroll; padding-right: 20px;[/class] [class=break]display: block; margin-bottom: 15px; font-size: 15px; line-height: 15px;[/class] [class=sideholder]position: absolute; height: 500px; width: 150px; right: 0; top: 0; background-color: #dcabab;[/class] [class=name]width: 500px; font-family: montserrat; font-weight: 800; text-transform: lowercase; font-size: 30px; letter-spacing: -1px; color: #424242; display: table; text-align: center; position: absolute; bottom: -150px; height: 150px; line-height: 150px; padding-bottom: 0px; transform: rotate(-90deg); transform-origin: left top 0; float: left; text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;[/class] [class name="nc" state="hover"] cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #262626; transition: 1s; [/class] [script class=tab1 on=click] hide tabContents02 hide tabContents03 hide tabContents04 hide tabContents05 slideDown 1000 tabContents01 addClass ct nc1 removeClass ct nc2 removeClass ct nc3 removeClass ct nc4 removeClass ct nc5 [/script] [script class=tab2 on=click] hide tabContents01 hide tabContents03 hide tabContents04 hide tabContents05 slideDown 1000 tabContents02 addClass ct nc2 removeClass ct nc1 removeClass ct nc3 removeClass ct nc4 removeClass ct nc5 [/script] [script class=tab3 on=click] hide tabContents01 hide tabContents02 hide tabContents04 hide tabContents05 slideDown 1000 tabContents03 addClass ct nc3 removeClass ct nc1 removeClass ct nc2 removeClass ct nc4 removeClass ct nc5 [/script] [script class=tab4 on=click] hide tabContents01 hide tabContents02 hide tabContents03 hide tabContents05 slideDown 1000 tabContents04 addClass ct nc4 removeClass ct nc1 removeClass ct nc2 removeClass ct nc3 removeClass ct nc5 [/script] [script class=tab5 on=click] hide tabContents01 hide tabContents02 hide tabContents03 hide tabContents04 slideDown 1000 tabContents05 addClass ct nc5 removeClass ct nc1 removeClass ct nc2 removeClass ct nc3 removeClass ct nc4 [/script]
[div class=container][div class=holder][div class=tabs]
[div class="tab tab2"]( [div class="nc nc2"]looks[/div] )[/div] [div class="tab tab3"]( [div class="nc nc3"]persona[/div] )[/div] [div class="tab tab4"]( [div class="nc nc4"]history[/div] )[/div] [div class="tab tab5"]( [div class="nc nc5"]connections[/div] )[/div][/div][/div]
[div class="tabContents tabContents01"][div class=container][div class=tab1top][div class=tab1toppic][/div][/div]
[div class=tab1topinfo]// full name
[div class=tab1toptag]name here[/div]
// age
[div class=tab1toptag]age here[/div]
// face claim
[div class=tab1toptag]face claim here[/div]
// role
[div class=tab1toptag]role here[/div][/div]
[div class=tab1bottom][div class=tab1bottominfo][div class=tab1bottomtitle]basics:[/div]
[div class=tag]nickname(s)[/div] [div class=ans]info.[/div]
[div class=tag]gender[/div] [div class=ans]info.[/div]
[div class=tag]date of birth[/div] [div class=ans]info.[/div]
[div class=tag]zodiac[/div] [div class=ans]info.[/div]
[div class=tag]sexuality[/div] [div class=ans]info.[/div]
[div class=tag]ethnicity[/div] [div class=ans]info.[/div]
[div class=tag]place of birth[/div] [div class=ans]info.[/div]
[div class=tag]currently residing[/div] [div class=ans]info.[/div]
[div class=tag]occupation[/div] [div class=ans]info.[/div][/div]
[div class=tab1bottompics]
[/div][/div][/div][/div]
[div class="tabContents tabContents02" style="display: none; margin-left: -20px; width: 430px;"][div class=tabcontainer][div class=tab2slab]appearance[/div]
[div class=tab2appearance][div class=tag]height[/div] [div class=ans]info.[/div]
[div class=tag]weight[/div] [div class=ans]info.[/div]
[div class=tag]skin[/div] [div class=ans]info.[/div]
[div class=tag]hair[/div] [div class=ans]info.[/div]
[div class=tag]eyes[/div] [div class=ans]info.[/div]
[div class=tag]body type[/div] [div class=ans]info.[/div]
[div class=tag]distinctive features[/div] [div class=ans]info.[/div]
[div class=tag]scars + markings[/div] [div class=ans]info.[/div]
[div class=tag]tattoos + piercings[/div] [div class=ans]info.[/div]
[div class=tag]attire[/div] [div class=ans]info.[/div]
[div class=tag]mental ailments[/div] [div class=ans]info.[/div][/div]
[/div][/div]
[div class="tabContents tabContents03" style="display: none;"][div class=tabcontainer][div class=tab3title]positive traits.[/div]
[div class=tab3persona style="top: 23px;"][div class=tab3container]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam enim erat, luctus id orci sit amet, rutrum finibus ante. Quisque eget sagittis orci, id bibendum ante. Fusce nec nisl fermentum, volutpat nibh vitae, tristique massa. Integer dapibus dolor eu nunc elementum elementum. Nunc a consequat tellus. Nunc sed lobortis metus, in aliquet nunc. Proin finibus nunc vitae sodales maximus. Curabitur suscipit, sem ut interdum semper, dolor est sagittis enim, in posuere enim odio sed ex. Cras sit amet ipsum nec felis egestas sollicitudin a eget ligula. Quisque et orci id magna feugiat consectetur.[/div][/div]
[div class=tab3title style="top: 145px;"]neutral traits.[/div]
[div class=tab3persona style="top: 61px;"][div class=tab3container]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam enim erat, luctus id orci sit amet, rutrum finibus ante. Quisque eget sagittis orci, id bibendum ante. Fusce nec nisl fermentum, volutpat nibh vitae, tristique massa. Integer dapibus dolor eu nunc elementum elementum. Nunc a consequat tellus. Nunc sed lobortis metus, in aliquet nunc. Proin finibus nunc vitae sodales maximus. Curabitur suscipit, sem ut interdum semper, dolor est sagittis enim, in posuere enim odio sed ex. Cras sit amet ipsum nec felis egestas sollicitudin a eget ligula. Quisque et orci id magna feugiat consectetur.[/div][/div]
[div class=tab3title style="top: 290px;"]negative traits.[/div]
[div class=tab3persona style="top: 99px;"][div class=tab3container]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam enim erat, luctus id orci sit amet, rutrum finibus ante. Quisque eget sagittis orci, id bibendum ante. Fusce nec nisl fermentum, volutpat nibh vitae, tristique massa. Integer dapibus dolor eu nunc elementum elementum. Nunc a consequat tellus. Nunc sed lobortis metus, in aliquet nunc. Proin finibus nunc vitae sodales maximus. Curabitur suscipit, sem ut interdum semper, dolor est sagittis enim, in posuere enim odio sed ex. Cras sit amet ipsum nec felis egestas sollicitudin a eget ligula. Quisque et orci id magna feugiat consectetur.[/div][/div][/div][/div]
[div class="tabContents tabContents04" style="display: none;"][div class=tabcontainer][div class=tab4history][div class=tab4container]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam enim erat, luctus id orci sit amet, rutrum finibus ante. Quisque eget sagittis orci, id bibendum ante. Fusce nec nisl fermentum, volutpat nibh vitae, tristique massa. Integer dapibus dolor eu nunc elementum elementum. Nunc a consequat tellus. Nunc sed lobortis metus, in aliquet nunc. Proin finibus nunc vitae sodales maximus. Curabitur suscipit, sem ut interdum semper, dolor est sagittis enim, in posuere enim odio sed ex. Cras sit amet ipsum nec felis egestas sollicitudin a eget ligula. Quisque et orci id magna feugiat consectetur.
Integer dapibus euismod sapien in aliquet. Vestibulum non ligula ante. Curabitur risus nunc, fermentum in neque auctor, convallis auctor justo. Sed eget ultricies massa, et rutrum odio. Aliquam massa sapien, varius ac est nec, varius pellentesque velit. Nunc semper dui non massa consectetur pharetra. Duis sed quam eget risus eleifend eleifend nec vulputate tortor. Pellentesque aliquet ac erat ac dignissim. Sed ut ultricies nibh. Suspendisse nibh nulla, consectetur sed fermentum non, porttitor vulputate neque. Pellentesque facilisis dolor scelerisque est venenatis maximus. Fusce ultrices, quam a eleifend congue, nunc augue vehicula est, sit amet vehicula mauris nisi a nisi. Nunc mollis elementum tellus, vel sollicitudin risus accumsan id. Duis metus augue, semper eget mattis nec, pretium pellentesque ligula. Mauris feugiat ligula quis massa congue euismod.[/div][/div]
[div class=tab4pic][/div][/div][/div]
[div class="tabContents tabContents05" style="display: none;"][div class=tab5container][div class=relationshipbar][div class=relationshipinfo][div class=tag]character name.[/div][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque libero urna, vulputate sit amet orci nec, imperdiet vehicula ipsum. In vitae volutpat odio. Nam convallis turpis ac elit pellentesque condimentum. Donec euismod ipsum in lorem blandit ultrices. Aliquam neque nisi, gravida tempus rutrum id, faucibus ac quam. In ipsum sapien, convallis at quam vitae, maximus fringilla mi. Vestibulum eget ante enim. In non neque libero. Nam consectetur id odio nec tincidunt. Mauris quis aliquam lacus. Aliquam fermentum sit amet quam et rhoncus. Maecenas a urna nibh. Morbi pellentesque in ligula quis elementum. Vestibulum ornare id nisi nec varius. Praesent mattis ultricies nisi, vel dictum metus lacinia vel. Maecenas nisl libero, laoreet at aliquet at, aliquet nec magna.[/div][/div][/div]
[div class=break][/div]
[div class=relationshipbar][div class=relationshipinfo][div class=tag]character name.[/div][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque libero urna, vulputate sit amet orci nec, imperdiet vehicula ipsum. In vitae volutpat odio. Nam convallis turpis ac elit pellentesque condimentum. Donec euismod ipsum in lorem blandit ultrices. Aliquam neque nisi, gravida tempus rutrum id, faucibus ac quam. In ipsum sapien, convallis at quam vitae, maximus fringilla mi. Vestibulum eget ante enim. In non neque libero. Nam consectetur id odio nec tincidunt. Mauris quis aliquam lacus. Aliquam fermentum sit amet quam et rhoncus. Maecenas a urna nibh. Morbi pellentesque in ligula quis elementum. Vestibulum ornare id nisi nec varius. Praesent mattis ultricies nisi, vel dictum metus lacinia vel. Maecenas nisl libero, laoreet at aliquet at, aliquet nec magna.[/div][/div][/div]
[div class=break][/div]
[div class=relationshipbar][div class=relationshipinfo][div class=tag]character name.[/div][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque libero urna, vulputate sit amet orci nec, imperdiet vehicula ipsum. In vitae volutpat odio. Nam convallis turpis ac elit pellentesque condimentum. Donec euismod ipsum in lorem blandit ultrices. Aliquam neque nisi, gravida tempus rutrum id, faucibus ac quam. In ipsum sapien, convallis at quam vitae, maximus fringilla mi. Vestibulum eget ante enim. In non neque libero. Nam consectetur id odio nec tincidunt. Mauris quis aliquam lacus. Aliquam fermentum sit amet quam et rhoncus. Maecenas a urna nibh. Morbi pellentesque in ligula quis elementum. Vestibulum ornare id nisi nec varius. Praesent mattis ultricies nisi, vel dictum metus lacinia vel. Maecenas nisl libero, laoreet at aliquet at, aliquet nec magna.[/div][/div][/div]
[/div][/div]
[div class=sideholder][div class=name]character name.[/div][/div][/div][/div]
[div class="tab tab1"]( [div class="nc nc1 ct"]info
) coded by
constellation
.
[/div]
constellation
.
Last edited:
Luxura
Thirteenth Mystic โฅArt by Peritwinkleโฅ
Good morning loves!
So, my RP group would love to use Royal Orchid (
we like it a lot) actually as a Character Profile and not as an IC post format.
We are wondering how possible it would be to add additional Tabs into the main text section?
I attached a photo for ref of what I mean.
They would essentially be additional text tabs. So the original tab script would stay as it is, and the others would only appear once you've activated it.
Those tabs would then be extras like "Relationships", "Attributes", etc.
I've been learning code for the last week, and have tried on my own to see if I could make it work so I wouldn't have to bother you with such a simple thing
but I actually haven't been able to crack it for the last two days.
I wasn't sure if I should fill out another Request Form but I did anyway just in case, in the Spoiler below
So, my RP group would love to use Royal Orchid (
we like it a lot) actually as a Character Profile and not as an IC post format.We are wondering how possible it would be to add additional Tabs into the main text section?
I attached a photo for ref of what I mean.
They would essentially be additional text tabs. So the original tab script would stay as it is, and the others would only appear once you've activated it.
Those tabs would then be extras like "Relationships", "Attributes", etc.
I've been learning code for the last week, and have tried on my own to see if I could make it work so I wouldn't have to bother you with such a simple thing
but I actually haven't been able to crack it for the last two days.
I wasn't sure if I should fill out another Request Form but I did anyway just in case, in the Spoiler below
โ
code type Character Profile (Royal Orchid Edit)
โ overall size Medium
โ images None
โ colours Same as Royal Orchid
โ fonts Same as Royal Orchid
โ any specific details Could we have smaller buttons to match the 'Home' tab (like maybe 50% smaller)? Same style (black with white icon)
We would like Three (3) in total, 'Lore' 'Attributes' and 'Relationships'.
'Attributes' and 'Relationships would be new tabs, 'Lore' would actually circle back to the Original Text Tab (Content07?) so that you can flip through them all without having to return to Home state and start over.
Icon ideas could be... Lore=book, Attributes=hand, Relationships=heart? I'd leave it up to you.
โ coder either! But I suppose Christy since she posted Royal Orchid
โ overall size Medium
โ images None
โ colours Same as Royal Orchid
โ fonts Same as Royal Orchid
โ any specific details Could we have smaller buttons to match the 'Home' tab (like maybe 50% smaller)? Same style (black with white icon)
We would like Three (3) in total, 'Lore' 'Attributes' and 'Relationships'.
'Attributes' and 'Relationships would be new tabs, 'Lore' would actually circle back to the Original Text Tab (Content07?) so that you can flip through them all without having to return to Home state and start over.
Icon ideas could be... Lore=book, Attributes=hand, Relationships=heart? I'd leave it up to you.
โ coder either! But I suppose Christy since she posted Royal Orchid
monxmiracle
Kris
I'm honestly, trying to learn how to code. But since, I'm like still not that proficient, and I actually still want to be aesthetic I would like to make a request for an in character sheet. I failed, at my first attempt so..
code type in character sheet
overall size since I'm planning on reusing the code a lot I'd like it to be mobile friendly
images I would like if possible to have two editable images on the side, and like one main one covering the text box, or above the text box.
colours I want some sort of neutral palette, color scheme? I'll link some below
fonts Any sans serif fonts, but preferably Rubik
any specific details I actually want something similar to any one of these Tumblr themes, but much more compact. And if possible I'd like to have the image on the side, be like a hover between two images. And on the cover for the text box maybe a hover that shows you the characters name, any mentions, mood, location etc, and a button, that makes the cover slide to reveal the text box? Like having three small "buttons" underneath the text box, and one real one in the middle that reveals the text? Plus a hidden scroll? sorry if that's a lot, I'd do it myself, but I still have a lot to learn
coder You both are amazing at coding, so I don't mind which of you does this for me^^ Please take as much time as you need^^
Attachments
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
hey! so i have an existing character sheet code that matches royal orchid, so i can go ahead and post that as a freebie instead of altering the ic code to fit?Good morning loves!
So, my RP group would love to use Royal Orchid (
We are wondering how possible it would be to add additional Tabs into the main text section?
I attached a photo for ref of what I mean.
They would essentially be additional text tabs. So the original tab script would stay as it is, and the others would only appear once you've activated it.
Those tabs would then be extras like "Relationships", "Attributes", etc.
View attachment 647697
I've been learning code for the last week, and have tried on my own to see if I could make it work so I wouldn't have to bother you with such a simple thing
but I actually haven't been able to crack it for the last two days.
I wasn't sure if I should fill out another Request Form but I did anyway just in case, in the Spoiler below
โcode type Character Profile (Royal Orchid Edit)
โ overall size Medium
โ images None
โ colours Same as Royal Orchid
โ fonts Same as Royal Orchid
โ any specific details Could we have smaller buttons to match the 'Home' tab (like maybe 50% smaller)? Same style (black with white icon)
We would like Three (3) in total, 'Lore' 'Attributes' and 'Relationships'.
'Attributes' and 'Relationships would be new tabs, 'Lore' would actually circle back to the Original Text Tab (Content07?) so that you can flip through them all without having to return to Home state and start over.
Icon ideas could be... Lore=book, Attributes=hand, Relationships=heart? I'd leave it up to you.
โ coder either! But I suppose Christy since she posted Royal Orchid
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
christy
says:
monxmiracle
; hi there! thank you so much for considering us for your code request! unfortunately, at this time, neither constellation or i believe we can carry out your request to the best of our abilities, and we'd hate to give you something with just half effort that neither of us quite believe in much.
we're sorry! and we genuinely hope you find someone who can make your code the way you want it.
Luxura
Thirteenth Mystic โฅArt by Peritwinkleโฅ
honeylemon
Sweetest Fiend
โ code type ic post
โ overall size small please!
โ images Just one, a 100x100 placeholder would be great
โ colours Pastel colours!
โ fonts no not really
โ any specific details i'd like for it to be layed out it the orion post please! for the little info bits off to the side of the actual text could they be: name, house, role, location, & tags?
โ coder no preference
โ overall size small please!
โ images Just one, a 100x100 placeholder would be great
โ colours Pastel colours!
โ fonts no not really
โ any specific details i'd like for it to be layed out it the orion post please! for the little info bits off to the side of the actual text could they be: name, house, role, location, & tags?
โ coder no preference
Last edited:
mikaluvkitties
Professional Unicorn Lover
hello! hope i filled this out right- please let me know if i didnt ;w;
โ code type Interest check please
โ overall size Medium would be nice!
โ images (how many image placeholders do you want?)
โ colours I'm looking at whites and greys with maybe some blues. A specific palette I really like for this is like is this one.
โ fonts Handlee gives off a vibe I really like for this!
โ any specific details So I actually put together a rough picture of what I'm kind of imagining- I know the chances of it being exactly like this are, uh, none, but I thought it'd most clearly illustrate what I'm looking for. Hope that's okay!
If either of you need to talk to me about the code during the process I am almost always on too!!!
โ coder No preference
โ code type Interest check please
โ overall size Medium would be nice!
โ images (how many image placeholders do you want?)
โ colours I'm looking at whites and greys with maybe some blues. A specific palette I really like for this is like is this one.
โ fonts Handlee gives off a vibe I really like for this!
โ any specific details So I actually put together a rough picture of what I'm kind of imagining- I know the chances of it being exactly like this are, uh, none, but I thought it'd most clearly illustrate what I'm looking for. Hope that's okay!
โ coder No preference
constellation
๐บ ๐๐๐๐๐ ๐๐๐บ๐
constellation
says:
mikaluvkitties
; your request has been accepted!
i'll get back to you as soon as possible with your code. please be patient, thank you c:
looking forward to creating your request
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
christy
says:
honeylemon
; hi there! your request is accepted! i'll get to work on it in a bit and get something for you soon!
thanks so much for requesting!
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
[class=image]
width: 150px;
height: 150px;
background: url(https://i.pinimg.com/564x/ff/01/10/ff01106474b0c488d4671c6cb7699b80.jpg);
background-size: cover;
border-radius: 100% 100% 0% 100%;
[/class]
[class=number]
width: 100%;
height: 100%;
border-radius: 100% 100% 0% 100%;
opacity: 0;
color: #fff;
text-align: center;
transition: 1s;
[/class]
[class=link2]
display: inline-block;
color: #a69deb;
cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
transition: 1s;
[/class]
[class name=image state=hover]
transition: 1s;
filter: grayscale(100%);
[/class]
[class name=number state=hover]
opacity: 1;
transition: 1s;
background-color: rgba(0,0,0,0.5);
[/class]
[class name=link2 state=hover]
color: #5f53b5;
transition: 1s;
[/class]
Luxura
; here is the code to match the royal orchid IC code and placeholder code. the colour scheme is the same and it has six tabs + one home tab. 'br' tags are necessary for line and paragraph break. this is unfortunately not mobile friendly. if you have any questions regarding the use of the code, feel free to message me!
[/div][/div][/div]
[class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin-top: 10px; padding: 0px 3px 2px 3px; font-family: Playfair Display; color: #fff; background: #000; font-size: 11px; margin-right: 3px; text-transform: uppercase; [/class] [class=tag4] display: inline; margin-top: 10px; padding: 0px 6px 0px 6px; font-family: Playfair Display; color: #fff; background: #000; font-size: 11px; text-transform: uppercase; [/class] [class=tag3] display: inline; margin-top: 10px; padding: 0px 3px 2px 3px; font-family: Playfair Display; color: #000; background: #fff; font-size: 11px; text-transform: uppercase; [/class] [class=tag2] display: inline; width: 100%; color: #000; border-bottom: 1px dotted #000; padding-bottom: 2px; [/class] [class=tag5] color: #000; border-bottom: 1px dotted #000; text-align: center; padding: 5px 0px 0px 0px; width: 85%; margin: auto; [/class] [class=home] color: #fff; width: 60px; height: 60px; margin: auto; box-sizing: border-box; background: #000; padding-top: 5px; border-radius: 100%; border: 1px solid #000; font-size: 25px; text-align: center; font-weight: bold; text-transform: uppercase; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: all 1s; [/class] [class name=home state=hover] color: #d69754; transition: all 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tab] box-sizing: border-box; background: #fff; border-radius: 5px; padding: 3px; width: 25px; height: 25px; color: #000; text-align: center; transition: all .5s; font-size: 12px; font-family: Avenir; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class name=tab state=hover] color: #d69754; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=selectedTab] padding: 3px; background: #d69754; text-align: center; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class name=selectedTab state=hover] color: #000; background: #d69754; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tabContents] position: absolute; opacity: 0; transition: all 1s; width: 294px; font-size: 11px; line-height: 26px; background: #fff; color: #000; height: 400px; box-sizing: border-box; [/class] [class=show] opacity: 1; z-index: 1; [/class] [script class=tab1 on=click] addClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab2 on=click] addClass show tabContents02 removeClass show tabContents01 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab2 removeClass selectedTab tab1 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab3 on=click] addClass show tabContents03 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab3 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab4 on=click] addClass show tabContents04 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab4 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab5 on=click] addClass show tabContents05 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab5 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab6 [/script] [script class=tab6 on=click] addClass show tabContents06 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents05 removeClass show tabContents04 removeClass show tabContents07 addClass selectedTab tab6 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab5 removeClass selectedTab tab4 [/script] [script class=home on=click] addClass show tabContents07 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script]
[div class="tab tab3"]
[div class=tag]full name
info.
[div class=tag]nicknames[/div]
info.
[div class=tag]age[/div]
info.
[div class=tag]d.o.b[/div]
info.
[div class=tag]gender[/div]
info.
[div class=tag]sexuality[/div]
info. [/div] [/div] [div class="tabContents tabContents02"]
[div class=tag]eyes [div class=tag2]info[/div]
[div class=tag]build[/div] [div class=tag2]info.[/div] [/div]
[div class=tag]hair[/div] [div class=tag2]info.[/div]
[div class=tag]skin[/div] [div class=tag2]info.[/div] [/div] [/div]
[div class=tag]dist. features[/div] [div class=tag2]info.[/div]
[div class=tag]attire[/div] [div class=tag2]info.[/div]
[div class=tag]face claim[/div] [div class=tag2]info.[/div] [/div] [/div] [div class="tabContents tabContents03"]
[div class=tag]personality
info.
[div class=tag]likes[/div]
info.
[div class=tag]dislikes[/div]
info.
[div class=tag]mental ailments[/div]
info.
[div class=tag]dominant hand[/div]
info.
[div class=tag]etc.[/div]
info. [/div] [/div] [div class="tabContents tabContents04"]
[div class=tag]strengths
info.
[div class=tag]weaknesses[/div]
info.
[div class=tag]skills[/div]
info.
[div class=tag]etc.[/div]
info. [/div] [/div] [div class="tabContents tabContents05"]
[/div]
[div class="tabContents tabContents06"]
[/div]
[/div]
[/div]
[/div][/div]
https://www.rpnation.com/threads/๐ฐ๐ต๐ฟ๐ถ๐๐๐-โงพ-๐ฐ๐ผ๐ป๐๐๐ฒ๐น๐น๐ฎ๐๐ถ๐ผ๐ปโฒ๐-๐ฐ๐ฟ๐ถ๐๐ฝ๐-๐ฐ๐ผ๐ฑ๐ฒ๐.454487/post-9951524[/div]
christy's code
[div class=image][div class=number]
22
royal orchid (cs) ; [div class=link2]code
https://pastebin.com/raw/vsfs2YR4
Luxura
; here is the code to match the royal orchid IC code and placeholder code. the colour scheme is the same and it has six tabs + one home tab. 'br' tags are necessary for line and paragraph break. this is unfortunately not mobile friendly. if you have any questions regarding the use of the code, feel free to message me![class=link] display: inline-block; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: 1s; font-size: 9px; font-family: Avenir; padding-top: 5px; color: #999; [/class] [class=tag] display: inline; margin-top: 10px; padding: 0px 3px 2px 3px; font-family: Playfair Display; color: #fff; background: #000; font-size: 11px; margin-right: 3px; text-transform: uppercase; [/class] [class=tag4] display: inline; margin-top: 10px; padding: 0px 6px 0px 6px; font-family: Playfair Display; color: #fff; background: #000; font-size: 11px; text-transform: uppercase; [/class] [class=tag3] display: inline; margin-top: 10px; padding: 0px 3px 2px 3px; font-family: Playfair Display; color: #000; background: #fff; font-size: 11px; text-transform: uppercase; [/class] [class=tag2] display: inline; width: 100%; color: #000; border-bottom: 1px dotted #000; padding-bottom: 2px; [/class] [class=tag5] color: #000; border-bottom: 1px dotted #000; text-align: center; padding: 5px 0px 0px 0px; width: 85%; margin: auto; [/class] [class=home] color: #fff; width: 60px; height: 60px; margin: auto; box-sizing: border-box; background: #000; padding-top: 5px; border-radius: 100%; border: 1px solid #000; font-size: 25px; text-align: center; font-weight: bold; text-transform: uppercase; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; transition: all 1s; [/class] [class name=home state=hover] color: #d69754; transition: all 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tab] box-sizing: border-box; background: #fff; border-radius: 5px; padding: 3px; width: 25px; height: 25px; color: #000; text-align: center; transition: all .5s; font-size: 12px; font-family: Avenir; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class name=tab state=hover] color: #d69754; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=selectedTab] padding: 3px; background: #d69754; text-align: center; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class name=selectedTab state=hover] color: #000; background: #d69754; transition: all .5s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=tabContents] position: absolute; opacity: 0; transition: all 1s; width: 294px; font-size: 11px; line-height: 26px; background: #fff; color: #000; height: 400px; box-sizing: border-box; [/class] [class=show] opacity: 1; z-index: 1; [/class] [script class=tab1 on=click] addClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab2 on=click] addClass show tabContents02 removeClass show tabContents01 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab2 removeClass selectedTab tab1 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab3 on=click] addClass show tabContents03 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab3 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab4 on=click] addClass show tabContents04 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents05 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab4 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script] [script class=tab5 on=click] addClass show tabContents05 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents06 removeClass show tabContents07 addClass selectedTab tab5 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab6 [/script] [script class=tab6 on=click] addClass show tabContents06 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents05 removeClass show tabContents04 removeClass show tabContents07 addClass selectedTab tab6 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab5 removeClass selectedTab tab4 [/script] [script class=home on=click] addClass show tabContents07 removeClass show tabContents01 removeClass show tabContents02 removeClass show tabContents03 removeClass show tabContents04 removeClass show tabContents05 removeClass show tabContents06 removeClass selectedTab tab1 removeClass selectedTab tab2 removeClass selectedTab tab3 removeClass selectedTab tab4 removeClass selectedTab tab5 removeClass selectedTab tab6 [/script]
[div class=home]
meet the
role name
[div class="tab tab1"]
[div class="tab tab2"]
[div class="tab tab4"]
[div class="tab tab5"][/div]
[div class="tab tab6"][/div]
[/div]
[/div]
[div class="tabContents tabContents07 show"]
[div class="tabContents tabContents01"]
"You can put
if you
a quote here
if you
want to."
info.
[div class=tag]nicknames[/div]
info.
[div class=tag]age[/div]
info.
[div class=tag]d.o.b[/div]
info.
[div class=tag]gender[/div]
info.
[div class=tag]sexuality[/div]
info. [/div] [/div] [div class="tabContents tabContents02"]
[div class=tag]height
[div class=tag2]info.[div class=tag]eyes
[div class=tag]build[/div] [div class=tag2]info.[/div] [/div]
[div class=tag]weight
[div class=tag2]info.[/div]
[div class=tag]hair[/div] [div class=tag2]info.[/div]
[div class=tag]skin[/div] [div class=tag2]info.[/div] [/div] [/div]
[div class=tag]dist. features[/div] [div class=tag2]info.[/div]
[div class=tag]attire[/div] [div class=tag2]info.[/div]
[div class=tag]face claim[/div] [div class=tag2]info.[/div] [/div] [/div] [div class="tabContents tabContents03"]
info.
[div class=tag]likes[/div]
info.
[div class=tag]dislikes[/div]
info.
[div class=tag]mental ailments[/div]
info.
[div class=tag]dominant hand[/div]
info.
[div class=tag]etc.[/div]
info. [/div] [/div] [div class="tabContents tabContents04"]
info.
[div class=tag]weaknesses[/div]
info.
[div class=tag]skills[/div]
info.
[div class=tag]etc.[/div]
info. [/div] [/div] [div class="tabContents tabContents05"]
ages 0 - 5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
ages 6 - 10
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
ages 11 - 15
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
ages 16 - 19
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
current
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
person's name
relation to character
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
person's name
relation to character
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
person's name
relation to character
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie egestas augue. Nullam condimentum risus sed orci tristique ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed molestie tristique sem, quis finibus velit venenatis ac. Maecenas congue purus tortor, id posuere felis porttitor nec. Vestibulum libero ligula, ultricies ut laoreet in, molestie quis turpis. Mauris aliquam viverra velit, at tincidunt neque aliquam ac. Duis faucibus nibh sem, ac interdum magna pellentesque sed. Suspendisse facilisis nisl ac augue ultricies, ac viverra elit suscipit.
christy
๐๐๐ฃ๐๐ฎ ๐๐๐ฃ๐๐จ
of course! glad you like it.
alwaysxsunni
Sunni โธป 27 โธป they/them enby
Hey, i was wondering if you do multi tab about themes?