Resource beautiful soul [ template coding/storage ]

[BOKEH.]

hello! so, this thread is kind of me just trying to figure out the coding on this site. i'm a former feralfronter who use to do a lot of coding on feralfront back in the day.
of course, any coding i happen to edit (by edit i mean change the color, font, image, you get what i mean) that has been created by another user will be given credit for their work. all my work will contain a copyright as well. while i am not taking requests, you are more than welcome to use any of these! feel free to comment, ask questions, or share any concerns with me through this thread or through my dms.

 

[BOKEH.]

CRESENTIA OF GRYFFINDOR

- hidden scrollie
- semi-mobile friendly?; flip screen sideways to view full effect

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas imperdiet nunc quis orci ullamcorper, vitae molestie mi eleifend. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce sed arcu tempus, vehicula nisl at, ultrices metus. Aliquam ut ornare velit. Praesent sodales tincidunt nulla in porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis consectetur risus sed purus auctor euismod.

Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque nisi leo, tincidunt id ante quis, facilisis lacinia enim. Etiam pharetra faucibus massa nec blandit. Pellentesque dictum tortor eget finibus laoreet. Maecenas aliquet magna nunc, a dapibus lectus scelerisque a. Aliquam ut volutpat augue, eget tincidunt lorem. Suspendisse a orci quis dolor auctor viverra. Nam id pretium nisl, ut iaculis leo. Proin semper feugiat nibh sit amet bibendum. Praesent rhoncus erat malesuada, rutrum diam id, bibendum erat.

In leo diam, bibendum nec mauris sed, scelerisque rutrum nibh. Integer pharetra dictum auctor. Donec quis sollicitudin lectus. Pellentesque maximus tortor velit, ut consectetur tortor euismod ut. Suspendisse scelerisque purus velit, nec porta turpis vestibulum aliquet. Praesent eu rutrum ante. Donec commodo justo sit amet libero mattis vestibulum. Nullam at pharetra sem, non rhoncus lacus. Donec commodo accumsan eros, non tristique nibh porta nec. Phasellus interdum malesuada nisi sit amet posuere. Donec in dictum nisi, et egestas nulla. Aenean non nisi vitae erat dictum faucibus. Praesent nec odio augue. Donec lectus lacus, aliquet id ornare vitae, tempor vel elit. Vivamus in dictum quam, in pulvinar ex.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla interdum nisi ac diam sollicitudin, sed aliquam diam iaculis. Aliquam dapibus turpis ut dui interdum imperdiet. Integer nec nisi enim. Phasellus placerat ante nulla, eu semper velit scelerisque ac. Fusce faucibus ex eros, sed tristique lorem vulputate ut. In dignissim ultrices dolor sit amet rutrum. Nulla justo odio, lobortis in libero at, posuere pretium diam. Suspendisse vitae cursus augue. Vivamus a accumsan tortor.

Nullam congue enim elit, eget elementum nisi pulvinar et. Maecenas eget erat vulputate risus mollis scelerisque. Duis eu interdum tortor. Fusce sed venenatis nisi. Aliquam euismod arcu at nisl condimentum tempor. Donec laoreet velit convallis ante gravida, ac tempus sapien molestie. Quisque suscipit quis tortor sed commodo. Aliquam vitae ligula massa. Duis tempus porttitor neque lacinia luctus. Vestibulum scelerisque rutrum rutrum. Quisque auctor bibendum enim eu lobortis. Proin mattis metus et ultrices rutrum. Etiam interdum lobortis mi, vel tempor quam consectetur vel.

TEMPLATE © BOKEH

Spoiler: code

[border=2px white solid; border-radius: 50%; height: 150px; width: 150px; background-image: url(IMAGE LINK HERE); background-position: center;background-size:100%; margin: auto;][/border]
[border=0px; width: 500px; height: 30px; font-size: 24px; line-height: 12px; text-align: center; color: #HEXCODE; font-family: georgia; margin: auto;  padding: 20px;][b]NAME HERE[/b][/border]
[border=0px; box-sizing: border-box; padding: 20px 0 10px 0; max-width: 500px; height: 330px; margin: auto; overflow: hidden; margin-top: -50px][border= 0px; box-sizing: border-box; width: 200%; height: 100%; overflow: auto;][border=0px; box-sizing: border-box; padding: 0 20px 0 20px; width: 50%; font-size: 12px; line-height: 12px; text-align: justify; color: white;]TEXT GOES HERE
[/border][/border][/border]
[center][size=1][color=gray]TEMPLATE © BOKEH[/color][/size][/center]

​

Spoiler: light mode version

CRESENTIA OF GRYFFINDOR

- hidden scrollie
- semi-mobile friendly?; flip screen sideways to view full effect

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas imperdiet nunc quis orci ullamcorper, vitae molestie mi eleifend. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce sed arcu tempus, vehicula nisl at, ultrices metus. Aliquam ut ornare velit. Praesent sodales tincidunt nulla in porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis consectetur risus sed purus auctor euismod.

Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque nisi leo, tincidunt id ante quis, facilisis lacinia enim. Etiam pharetra faucibus massa nec blandit. Pellentesque dictum tortor eget finibus laoreet. Maecenas aliquet magna nunc, a dapibus lectus scelerisque a. Aliquam ut volutpat augue, eget tincidunt lorem. Suspendisse a orci quis dolor auctor viverra. Nam id pretium nisl, ut iaculis leo. Proin semper feugiat nibh sit amet bibendum. Praesent rhoncus erat malesuada, rutrum diam id, bibendum erat.

In leo diam, bibendum nec mauris sed, scelerisque rutrum nibh. Integer pharetra dictum auctor. Donec quis sollicitudin lectus. Pellentesque maximus tortor velit, ut consectetur tortor euismod ut. Suspendisse scelerisque purus velit, nec porta turpis vestibulum aliquet. Praesent eu rutrum ante. Donec commodo justo sit amet libero mattis vestibulum. Nullam at pharetra sem, non rhoncus lacus. Donec commodo accumsan eros, non tristique nibh porta nec. Phasellus interdum malesuada nisi sit amet posuere. Donec in dictum nisi, et egestas nulla. Aenean non nisi vitae erat dictum faucibus. Praesent nec odio augue. Donec lectus lacus, aliquet id ornare vitae, tempor vel elit. Vivamus in dictum quam, in pulvinar ex.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla interdum nisi ac diam sollicitudin, sed aliquam diam iaculis. Aliquam dapibus turpis ut dui interdum imperdiet. Integer nec nisi enim. Phasellus placerat ante nulla, eu semper velit scelerisque ac. Fusce faucibus ex eros, sed tristique lorem vulputate ut. In dignissim ultrices dolor sit amet rutrum. Nulla justo odio, lobortis in libero at, posuere pretium diam. Suspendisse vitae cursus augue. Vivamus a accumsan tortor.

Nullam congue enim elit, eget elementum nisi pulvinar et. Maecenas eget erat vulputate risus mollis scelerisque. Duis eu interdum tortor. Fusce sed venenatis nisi. Aliquam euismod arcu at nisl condimentum tempor. Donec laoreet velit convallis ante gravida, ac tempus sapien molestie. Quisque suscipit quis tortor sed commodo. Aliquam vitae ligula massa. Duis tempus porttitor neque lacinia luctus. Vestibulum scelerisque rutrum rutrum. Quisque auctor bibendum enim eu lobortis. Proin mattis metus et ultrices rutrum. Etiam interdum lobortis mi, vel tempor quam consectetur vel.

TEMPLATE © BOKEH​

Spoiler: light-mode version code

[border=2px #HEXCODE solid; border-radius: 50%; height: 150px; width: 150px; background-image: url(IMAGE LINK HERE); background-position: center;background-size:100%; margin: auto;][/border]
[border=0px; width: 500px; height: 30px; font-size: 24px; line-height: 12px; text-align: center; color: #HEXCODE; font-family: georgia; margin: auto;  padding: 20px;][b]NAME HERE[/b][/border]
[border=0px; box-sizing: border-box; padding: 20px 0 10px 0; max-width: 500px; height: 330px; margin: auto; overflow: hidden; margin-top: -50px][border= 0px; box-sizing: border-box; width: 200%; height: 100%; overflow: auto;][border=0px; box-sizing: border-box; padding: 0 20px 0 20px; width: 50%; font-size: 12px; line-height: 12px; text-align: justify; color: none;]TEXT GOES HERE
[/border][/border][/border]
[center][size=1][color=gray]TEMPLATE © BOKEH[/color][/size][/center]

 

[BOKEH.]

RHYS OF RAVENCLAW

- mobile friendly code
- no hidden scrollie

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas imperdiet nunc quis orci ullamcorper, vitae molestie mi eleifend. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce sed arcu tempus, vehicula nisl at, ultrices metus. Aliquam ut ornare velit. Praesent sodales tincidunt nulla in porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis consectetur risus sed purus auctor euismod.

Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque nisi leo, tincidunt id ante quis, facilisis lacinia enim. Etiam pharetra faucibus massa nec blandit. Pellentesque dictum tortor eget finibus laoreet. Maecenas aliquet magna nunc, a dapibus lectus scelerisque a. Aliquam ut volutpat augue, eget tincidunt lorem. Suspendisse a orci quis dolor auctor viverra. Nam id pretium nisl, ut iaculis leo. Proin semper feugiat nibh sit amet bibendum. Praesent rhoncus erat malesuada, rutrum diam id, bibendum erat.

In leo diam, bibendum nec mauris sed, scelerisque rutrum nibh. Integer pharetra dictum auctor. Donec quis sollicitudin lectus. Pellentesque maximus tortor velit, ut consectetur tortor euismod ut. Suspendisse scelerisque purus velit, nec porta turpis vestibulum aliquet. Praesent eu rutrum ante. Donec commodo justo sit amet libero mattis vestibulum. Nullam at pharetra sem, non rhoncus lacus. Donec commodo accumsan eros, non tristique nibh porta nec. Phasellus interdum malesuada nisi sit amet posuere. Donec in dictum nisi, et egestas nulla. Aenean non nisi vitae erat dictum faucibus. Praesent nec odio augue. Donec lectus lacus, aliquet id ornare vitae, tempor vel elit. Vivamus in dictum quam, in pulvinar ex.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla interdum nisi ac diam sollicitudin, sed aliquam diam iaculis. Aliquam dapibus turpis ut dui interdum imperdiet. Integer nec nisi enim. Phasellus placerat ante nulla, eu semper velit scelerisque ac. Fusce faucibus ex eros, sed tristique lorem vulputate ut. In dignissim ultrices dolor sit amet rutrum. Nulla justo odio, lobortis in libero at, posuere pretium diam. Suspendisse vitae cursus augue. Vivamus a accumsan tortor.

Nullam congue enim elit, eget elementum nisi pulvinar et. Maecenas eget erat vulputate risus mollis scelerisque. Duis eu interdum tortor. Fusce sed venenatis nisi. Aliquam euismod arcu at nisl condimentum tempor. Donec laoreet velit convallis ante gravida, ac tempus sapien molestie. Quisque suscipit quis tortor sed commodo. Aliquam vitae ligula massa. Duis tempus porttitor neque lacinia luctus. Vestibulum scelerisque rutrum rutrum. Quisque auctor bibendum enim eu lobortis. Proin mattis metus et ultrices rutrum. Etiam interdum lobortis mi, vel tempor quam consectetur vel.

TEMPLATE © BOKEH

Spoiler: code

[border=0px; width:374px; height:100px; margin: auto;][border=1px white solid; width:100px; height:100px; background:url(IMAGE ONE LINK); background-size:cover; background-position:50%; margin-left:0px; float: left;][/border][border=1px white solid; width:100px; height:100px; background:url(IMAGE TWO LINK); background-size:cover; background-position:50%; margin-left: 4px; float: left;][/border][border=1px white solid; width:100px; height:100px; background:url(IMAGE THREE LINK); background-size:cover; background-position:50%; margin-left: 0px; float: right;][/border][/border]
[border=0px; width: 374px; height: 30px; font-size: 22px; line-height: 12px; text-align: center; color: #HEXCODE; font-family: georgia; margin: auto; margin-bottom: -50px;][b]NAME HERE[/b][/border]
[border=0px; width: 374px; font-size: 12px; line-height: 12px; text-align: justify; color: white; font-family: arial; margin: auto;]
TEXT GOES HERE
[/border]
[center][size=1][color=gray]TEMPLATE © BOKEH[/color][/size]

Spoiler: light-mode version

RHYS OF RAVENCLAW

- mobile friendly code
- no hidden scrollie

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas imperdiet nunc quis orci ullamcorper, vitae molestie mi eleifend. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce sed arcu tempus, vehicula nisl at, ultrices metus. Aliquam ut ornare velit. Praesent sodales tincidunt nulla in porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis consectetur risus sed purus auctor euismod.

Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque nisi leo, tincidunt id ante quis, facilisis lacinia enim. Etiam pharetra faucibus massa nec blandit. Pellentesque dictum tortor eget finibus laoreet. Maecenas aliquet magna nunc, a dapibus lectus scelerisque a. Aliquam ut volutpat augue, eget tincidunt lorem. Suspendisse a orci quis dolor auctor viverra. Nam id pretium nisl, ut iaculis leo. Proin semper feugiat nibh sit amet bibendum. Praesent rhoncus erat malesuada, rutrum diam id, bibendum erat.

In leo diam, bibendum nec mauris sed, scelerisque rutrum nibh. Integer pharetra dictum auctor. Donec quis sollicitudin lectus. Pellentesque maximus tortor velit, ut consectetur tortor euismod ut. Suspendisse scelerisque purus velit, nec porta turpis vestibulum aliquet. Praesent eu rutrum ante. Donec commodo justo sit amet libero mattis vestibulum. Nullam at pharetra sem, non rhoncus lacus. Donec commodo accumsan eros, non tristique nibh porta nec. Phasellus interdum malesuada nisi sit amet posuere. Donec in dictum nisi, et egestas nulla. Aenean non nisi vitae erat dictum faucibus. Praesent nec odio augue. Donec lectus lacus, aliquet id ornare vitae, tempor vel elit. Vivamus in dictum quam, in pulvinar ex.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla interdum nisi ac diam sollicitudin, sed aliquam diam iaculis. Aliquam dapibus turpis ut dui interdum imperdiet. Integer nec nisi enim. Phasellus placerat ante nulla, eu semper velit scelerisque ac. Fusce faucibus ex eros, sed tristique lorem vulputate ut. In dignissim ultrices dolor sit amet rutrum. Nulla justo odio, lobortis in libero at, posuere pretium diam. Suspendisse vitae cursus augue. Vivamus a accumsan tortor.

Nullam congue enim elit, eget elementum nisi pulvinar et. Maecenas eget erat vulputate risus mollis scelerisque. Duis eu interdum tortor. Fusce sed venenatis nisi. Aliquam euismod arcu at nisl condimentum tempor. Donec laoreet velit convallis ante gravida, ac tempus sapien molestie. Quisque suscipit quis tortor sed commodo. Aliquam vitae ligula massa. Duis tempus porttitor neque lacinia luctus. Vestibulum scelerisque rutrum rutrum. Quisque auctor bibendum enim eu lobortis. Proin mattis metus et ultrices rutrum. Etiam interdum lobortis mi, vel tempor quam consectetur vel.

TEMPLATE © BOKEH​

Spoiler: light-mode version code

[border=0px; width:374px; height:100px; margin: auto;][border=1px #HEXCODEBORDER solid; width:100px; height:100px; background:url(IMAGE ONE LINK); background-size:cover; background-position:50%; margin-left:0px; float: left;][/border][border=1px #HEXCODEBORDER solid; width:100px; height:100px; background:url(IMAGE TWO LINK); background-size:cover; background-position:50%; margin-left: 4px; float: left;][/border][border=1px #HEXCODEBORDER solid; width:100px; height:100px; background:url(IMAGE THREE LINK); background-size:cover; background-position:50%; margin-left: 0px; float: right;][/border][/border]
[border=0px; width: 374px; height: 30px; font-size: 22px; line-height: 12px; text-align: center; color: #HEXCODETITLE; font-family: georgia; margin: auto; margin-bottom: -50px;][b]NAME HERE[/b][/border]
[border=0px; width: 374px; font-size: 12px; line-height: 12px; text-align: justify; color: none; font-family: arial; margin: auto;]
TEXT GOES HERE
[/border]
[center][size=1][color=gray]TEMPLATE © BOKEH[/color][/size]

 

[A Mirage]

hey, i believe i remember you and your codes on feralfront! glad to see you're still around and making awesome codes!

 

[toucant]

bokeh!!! I remember the 3 picture code, it was my go-to for a really long time love to see you coding again!!

 

[Uxie]

dropping by to say that the templates are very lovely! but since you've used a white colour for the text it unfortunately isn't visible on light mode!
i'd recommend not setting a colour for the text, as the default colour switches appropriately between light and dark mode such that it's visible on both! (´｡• ᵕ •｡`)

 

[BOKEH.]

Uxie Thanks for the advice, dear! I did not even think of that because I always use dark/night mode for everything haha. I might go back and add in a light mode version when I get a chance!

 

[BOKEH.]

WIP

lowercase name *:･ﾟ✧

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas imperdiet nunc quis orci ullamcorper, vitae molestie mi eleifend. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce sed arcu tempus, vehicula nisl at, ultrices metus. Aliquam ut ornare velit. Praesent sodales tincidunt nulla in porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis consectetur risus sed purus auctor euismod.

Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque nisi leo, tincidunt id ante quis, facilisis lacinia enim. Etiam pharetra faucibus massa nec blandit. Pellentesque dictum tortor eget finibus laoreet. Maecenas aliquet magna nunc, a dapibus lectus scelerisque a. Aliquam ut volutpat augue, eget tincidunt lorem. Suspendisse a orci quis dolor auctor viverra. Nam id pretium nisl, ut iaculis leo. Proin semper feugiat nibh sit amet bibendum. Praesent rhoncus erat malesuada, rutrum diam id, bibendum erat.

In leo diam, bibendum nec mauris sed, scelerisque rutrum nibh. Integer pharetra dictum auctor. Donec quis sollicitudin lectus. Pellentesque maximus tortor velit, ut consectetur tortor euismod ut. Suspendisse scelerisque purus velit, nec porta turpis vestibulum aliquet. Praesent eu rutrum ante. Donec commodo justo sit amet libero mattis vestibulum. Nullam at pharetra sem, non rhoncus lacus. Donec commodo accumsan eros, non tristique nibh porta nec. Phasellus interdum malesuada nisi sit amet posuere. Donec in dictum nisi, et egestas nulla. Aenean non nisi vitae erat dictum faucibus. Praesent nec odio augue. Donec lectus lacus, aliquet id ornare vitae, tempor vel elit. Vivamus in dictum quam, in pulvinar ex.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla interdum nisi ac diam sollicitudin, sed aliquam diam iaculis. Aliquam dapibus turpis ut dui interdum imperdiet. Integer nec nisi enim. Phasellus placerat ante nulla, eu semper velit scelerisque ac. Fusce faucibus ex eros, sed tristique lorem vulputate ut. In dignissim ultrices dolor sit amet rutrum. Nulla justo odio, lobortis in libero at, posuere pretium diam. Suspendisse vitae cursus augue. Vivamus a accumsan tortor.

Nullam congue enim elit, eget elementum nisi pulvinar et. Maecenas eget erat vulputate risus mollis scelerisque. Duis eu interdum tortor. Fusce sed venenatis nisi. Aliquam euismod arcu at nisl condimentum tempor. Donec laoreet velit convallis ante gravida, ac tempus sapien molestie. Quisque suscipit quis tortor sed commodo. Aliquam vitae ligula massa. Duis tempus porttitor neque lacinia luctus. Vestibulum scelerisque rutrum rutrum. Quisque auctor bibendum enim eu lobortis. Proin mattis metus et ultrices rutrum. Etiam interdum lobortis mi, vel tempor quam consectetur vel.