NoveltyBox // gossymer

Server Downtime

2013-03-07T18:36:22Z

This is a headsup regarding the downtime for noveltybox's stylesheets: the host I've been using (flaredhost.com) has been down for over a week and has been unresponsive to email so far. My backups aren't the latest versions of the files on the servers but I'll try to get them online soon in any case as soon as I switch to an alternative server. I'm sorry about the stress it caused anyone :(

Minimalist Wikipedia Style

2011-08-19T02:35:03Z

Adapted Wikipedia Grey Lady III by Jeremy Tan into a more minimalist style with three variations depending on the user's display screen.

Name: Minimalist Wikipedia
Style: Revamped site scheme for wikipedia
Browsers: Tested so far in Chrome, Opera and Firefox but should work in IE and Safari too

Minimalist Central
Displays well across all resolutions

Install: Userscript // Userstyle

Minimalist Widescreen
Best suited to resolutions wider than 1280px

Install: Userscript // Userstyle

Minimalist Stretch
Best suited to resolutions less than1280px wide

Install: Userscript // Userstyle

Setting up userscripts in your browsers

Chrome installs the userscripts natively as extensions

Firefox requires the Greasemonkey extension installed first

Opera requires you to set up a folder first

Safari users can follow this guide

Internet Explorer requires Trixie (or an alternative)

Setting Up Userstyles

Firefox requires the Stylish extension

Opera can use them natively - instructions here

Horizon: Mellow Mint (Userscript)

2010-10-07T01:57:03Z

Was using the LJ banner script by daluci for some time now and ended up writing more css to restyle Horizon completely so 1) its more streamlined and 2) I don't get a visual surprise every month with a new LJ banner (which can sometimes be terrible TBH)

Name: Mellow Mint
Style: Revamped Horizon site scheme for livejournal (all accounts)
Browsers: Tested so far in Chrome, Opera and Firefox but should work in IE and Safari too

Version #1:

Bigger preview | Userscript download...

Version #2 with userpic:

Bigger preview | Userscript download...

Notes: The font used for the username is Fertigo Pro and you can download it here

I've tested the script in Chrome, Opera and Firefox so far but I don't use Macs or IE.

To use your own icon for the second version, make sure your picture is 75px wide and 75px high and upload it online. Copy the image source link and replace this text in the file:
http://pics.livejournal.com/gossymer/pic/009kb2pc

Setting up userscripts in your browsers

Chrome installs the userscripts natively as extensions

Firefox requires the Greasemonkey extension installed first

Opera requires you to set up a folder first

Safari users can follow this guide

Internet Explorer requires Trixie (or an alternative)

Editing userscripts in your browser: To find the userscript (after its installed) for editing:

For Chrome its usually under: C:\Users\YOURUSERNAME\AppData\Local\Google\Chrome\User Data\Default\Extensions\

For firefox you can do it through greasemonkey: instructions.
Note: if you haven't selected your text editor yet in greasemonkey, Notepad can be found under C:\Windows\system32\notepad.exe

For Opera and IE, simply go to the userscript folder (that you set up) to find the file.

Making more customizations?

If you would like to change colors, background images etc. my css can be found here and a breakdown of classes and IDs in Horizon is on the wiki here (which I only discovered after finishing this *facepalms* )

After you edit the code remember to:

Remove the notes/labels above each section
Remove line breaks (return key/enters)
Add a backslash (\) before each quote (")
Paste it into the original userscript (inside the quotes - e.g. var css ="your css goes here")

DreamWidth Layout: Tabula Rasa - Back to Basics

2009-04-20T18:57:22Z

DreamWidth Layout: Back to Basics

about
Style	Dreamwidth's Tabula Rasa
Best View:	1024px wide and up but optmized for screens that are between 1024px - 1280px wide.
Browsers Tested:	Firefox 3.1, Opera 9.64 & IE 8 on Vista - don't have a Mac for testing.
Navbar:	Optional
Notes:	This is just to tide people over until shiny official layouts come out.

LIVE PREVIEW

+ 10 colorschemes

light LIVE PREVIEW	dark LIVE PREVIEW
coffee LIVE PREVIEW	apple LIVE PREVIEW
chocolate LIVE PREVIEW	blue jeans LIVE PREVIEW
town red LIVE PREVIEW	royale LIVE PREVIEW
chocolate white LIVE PREVIEW	teal green LIVE PREVIEW

instructions
Select Tabula Rasa	Go to Customize on DreamWidth and click Apply Theme for the Tabula Rasa Layout Make sure 1 Column (no sidebar) has been selected at the bottom. Note: DO NOT use Negatives or Transmorgified or Zesty
Navigation	Go to Customize Style and choose the Dark Navigation strip. Click Save. Note: if you want to use the Light colorscheme, choose the light navigation
Modules	Go to Modules and UNcheck and select "none" (use the dropdown menus) for everything except for Basic Journal Info - Display Name as your #1 module and *Navigation* as your #2 Module. Make Sure Default Userpic and Website are UNchecked! Note: Make sure both Navigation AND Basic Journal Info have Group One selected in the drop down menus. Click Save.
Custom CSS	Go to Custom CSS and UNcheck Use layout's stylesheet(s) Copy and paste the link to the chosen colorscheme's stylesheet (listed just bellow)
Credit	Go to Manage Profile and copy/paste this code to your bio area: <P><B>Layout & Mini Icon Credits <a href="http://community.livejournal.com/noveltybox/12569.html">here</a> @ <lj site="livejournal.com" user="noveltybox"></B></P>

css links
original:	http://gossymer.com/storage/CSS/core2bluewhite.css
light:	http://gossymer.com/storage/CSS/core2light.css
dark:	http://gossymer.com/storage/CSS/core2dark.css
coffee:	http://gossymer.com/storage/CSS/core2coffee.css
apple:	http://gossymer.com/storage/CSS/core2green.css
chocolate:	http://gossymer.com/storage/CSS/core2brown.css
blue jeans:	http://gossymer.com/storage/CSS/core2bluedark.css
town red:	http://gossymer.com/storage/CSS/core2red.css
royale:	http://gossymer.com/storage/CSS/core2purple.css
chocolatewhite:	http://gossymer.com/storage/CSS/core2brownwhite.css
teal green:	http://gossymer.com/storage/CSS/core2darkgreen.css

resources
Mini Icons:	Axialis \| BlogPerfume \| Coquette \| FamFamFam \| Pinvoke \| WeFunction

Comment & Credit - you are free to edit for personal use!

★ Feel free to watch noveltybox

For how to get on DreamWidth and for more information, check this post here + the latest progress report here

Edit: Added two more colorschemes!

DW site schemes...

2009-04-17T00:13:43Z

I'm doing a few proposals for alternate site schemes at DW and just posting it here in case anyone has any suggestions/opinions on them.

original default site scheme that's on dreamwidth:

alternate site scheme mockup:

variation:

Might end up doing a poll next week with multiple mockups to guage which one is preferred >_> But yeah, I tried to stick with the reds but mainly wanted to reduce the height.

Icon guide: Photoshop action, tips & mini tut

2009-04-15T10:21:06Z

Since people were curious about my coloring in the FMA icons post and since I rarely make icons anyway, here is a Photoshop CS3 action to automatically change the coloring of images (preferably high quality anime screencaps).

I've also added some tips and a mini tutorial on resizing and sharpening.

(Click to zoom)

⇒

And:

⇒

Download the action here

Directions

Open a high quality anime screencap in Photoshop CS3 (you can find many @ diminishcap for instance)
Load the anime coloring ATN file in the actions palette
Zoom out of the image till you're at 50% view and then click play on the anime color boost action

Additional coloring options:

For more yellows, reds and blues: unhide/show the additional color folder

If you're image turns extremely blue like this, play the second action extreme blu color fix immediately after the anime color boost action (which results in THIS)

[Note: if it suddenly looks pixelly/choppy. please hide the Black & White 3 layer located in the addtional color folder]

After the action(s), for

very bright images:
1. hide the dust n noise reduced layer
2. unhide/show the Background layer

very dark images:
1. hide the dust n noise reduced layer
2. unhide/show the Background layer
3. unhide/show the screen layer
4. Increase the opacity of the screen layer to around 75%

At this point I usually play with the opacities of individual adustment layers to optimize coloring and then do one last selective coloring adjustment layer and one final levels layer.

Resizing into icons - my steps are:

Flatten the image
Filter/Noise/Reduce Noise with settings: Strength: 10, Preserve details: 9, Reduce Color Noise: 0, Sharpen Details: 14
Crop the image to 100px x 100px
Use Filter/Sharpen/Smart Sharpen with amount at 140% or so and radius at .2 pixels (that's POINT 2 pixels)
If its still not sharp enough I repeat Smart Sharpen with radius at .3 pixels and amount somewhere between 30% - 80%

Note: At the very end I usually use color dodge and linear burn/multiply layers as demonstrated by sinspire in this tutorial @ sundry_icons

Icons: Fullmetal Alchemist: Brotherhood

2009-04-14T09:21:41Z

[66] Fullmetal Alchemist: Brotherhood



Fullmetal Alchemist: Brotherhood

    01 - 04

    05 - 08

    09 - 12

    13 - 16

    17 - 20

        21 - 24

    25 - 28

    29 - 32

    33 - 36

    37 - 40

    41 - 44

    45 - 47
    01 - 04

+ extras // alternates

    48 - 51

    52 - 55

    56 - 59

    60 - 63

        64 - 66

EDIT: tutorial (and photoshop action) on how I got the above coloring was just posted over here!

Icons made using screencaps from diminishcap

Rules: credit + comment :) You can edit the alternates / extras, just credit for the base.

★ Feel free to watch noveltybox

LJ skinning...

2009-04-09T16:07:17Z

Heya guys! Been a while since a layout post but have a few things in the works :) Though I did get distracted yesterday by another bit of shiny.

boundary posted a userscript HERE to mintyapple for replacing all the old mini-icons all over the LJ website with prettier stuff (at least for firefox and opera users XD)

I'd forgotten about ljskins and customizing lj styles, but I pulled out my old CSS I'd been working on a year ago and played around with it for a couple of hours. While pretty much all icons will be replaced, I'm more focussed on changing the style. Here's what I got so far for the navigation:

Livejournal view:

My skin at the moment:

I'm not sure if the navbar menu should be black or greyish or an actual color >_> I just wanted it to be very minimalist in style so the focus could be on reading content.

Here's the before and after for the comments area - I still need to replace icons and a gazillion things but :)

Please note, that these customizations would work on all the default LJ pages with Horizon (profile page, homepage, default comment pages etc.).

Any opinions/preferences would be very much appreciated since I'm still a bit iffy on the design elements and font sizing/spacing. Basically, what would you prefer to see when it comes to navigation and comments?

Edit: Oh and if the skin came in multiple colorschemes - what colors would you personally want to use?

Profile: Desktop Journal

2009-02-10T19:03:14Z

No need to specify any width - the table will stretch according to the width of your browser window, just like the new lj profile. You are free to edit the contents of the journal area - add more pictures, leave one of the pages blank, have very little text, whatever.

The only rule is to comment & credit.

Desktop Journal
click for live preview

Go to Edit Personal Information and paste the code into your Bio

The Code

<TABLE WIDTH="100%" HEIGHT="650px" cellSpacing=0 cellPadding=0 border=0 background="http://pics.livejournal.com/gossymer/pic/007exx6y"><TR><TD><center><TABLE WIDTH="700px" HEIGHT="80px" cellSpacing=0 cellPadding=0 border=0 ><TR><TD><center><FONT face="Times New Roman, Times, Georgia, Palatino Linotype" color=#EEEEEE size = "6"><b>your main title goes over here</b></font>

<FONT face="Times New Roman, Times, Georgia, Palatino Linotype" color=#EEEEEE size = "3"><a href="URL"><font color="#eeeeee">LINK 1</font></a> | <a href="URL"><font color="#eeeeee">LINK 2</font></a> | <a href="URL"><font color="#eeeeee">LINK 3</font></a> | <a href="URL"><font color="#eeeeee">LINK 4</font></a> | <a href="URL"><font color="#eeeeee">LINK 5</font></a></font></center></TD></TR></TABLE><TABLE WIDTH="750px" HEIGHT="475px" cellSpacing=0 cellPadding=0 border=0 background="http://pics.livejournal.com/gossymer/pic/008swczh"><TBODY><TR height= 40px><TD> </TD><TD> </TD><TD> </TD><TD> </TD><TD> </TD></TR><TR><TD width=85px> </TD><TD VALIGN="top" width=260px><div align="justify"><FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "4"><b>First</b></FONT>
<FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eleifend, leo id egestas tincidunt, nisi sem tempus lacus, vel luctus neque mi at nibh. Nam venenatis laoreet odio. Proin luctus mattis augue. Quisque sed lacus. Aliquam et nulla. </FONT>

<FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "4"><b>Second</b></FONT>
<FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "2">Fusce lectus mauris, feugiat sed, pretium a, ultrices eget, metus. Suspendisse nec est ut felis commodo venenatis. Aenean magna. Integer malesuada, felis interdum sollicitudin auctor, enim dui eleifend arcu, eu suscipit ipsum nunc id felis. </FONT>

<FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "4"><b>Third</b></FONT>
<FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "2">Mauris ligula enim, auctor vel, hendrerit vel, tincidunt a, lorem.Etiam ipsum velit, facilisis ut, pharetra pretium, egestas ut, risus. Suspendisse nec est ut felis commodo venenatis condimentum sed, pretium vitae, tempus vitae, nibh. Vivamus ultrices. Pellentesque dui. Duis pharetra dictum odio. Nulla condimentum ligula nec eros. Aliquam nunc quam. </div></TD><TD width=65px> </TD><TD VALIGN="top" width=250px><center><img src="http://pics.livejournal.com/gossymer/pic/007ey4c8"></center>
<div align="justify"><FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "4"><b>Fourth</b></FONT>
<FONT face="Times New Roman, Times, Georgia,Palatino Linotype" color=#333333 size = "2">Maecenas tortor magna, condimentum sed, pretium vitae, tempus vitae, nibh. Vivamus ultrices. Pellentesque dui. Duis pharetra dictum odio. Nulla condimentum ligula nec eros. Aliquam nunc quam, semper sit amet, scelerisque nec.

<i>Pretium vitae, felis,
Vivamus mattis mauris,
Ut quam, quisque vel pede. </i></div></TD>
<TD width=80px> </TD></TR><TR height= 40px><TD> </TD><TD> </TD><TD> </TD><TD> </TD><TD> </TD></TR></TBODY></TABLE>
<TABLE WIDTH="750px" HEIGHT="30px" cellSpacing=0 cellPadding=0 border=0 ><TR><TD><FONT face="Arial" color=#dddddd size = "1"><center><a href="URL"><font color="#eeeeee">LAYOUT</font></a> | <a href="URL"><font color="#eeeeee">MOODTHEME</font></a> |  <a href="http://noveltybox.livejournal.com"><font color="#eeeeee">PROFILE</font></a></center></font></TD></TR></TABLE></center></TD></TR></TABLE>

Notes

#1 When adding links to the top navigation or profile codes make sure you've changed the link color as well as I've done in the code already

#2 Make sure to keep font tags for the journal text sections! You can change the fonts and size but make sure the tags are there.

#3 To delete the optional photo

Find and delete the img src tag that contains this url:
http://pics.livejournal.com/gossymer/pic/007ey4c8
And the 'center' tag around it

#4 To replace the optional photo

Find and replace the following URL
Image URL: http://pics.livejournal.com/gossymer/pic/0076c6ye
If you decide to change the image , choose something less than 250px wide.

#5 If you have very little text on the journal and want it to start in the middle/center of the page instead of the top, find:
VALIGN="top"

and replace it with
VALIGN="center"
It shows up twice so you need to replace it twice.

#6 Outside of the journal area, apart from replacing text, please do not add/edit too much 'cause the layout may break! Also don't add a huge amount of text to the journal area.

★ Feel free to watch noveltybox

Notice: Two fixes to codes :)

2008-12-16T17:50:23Z

Just a note for people using the following codes...

Fix for Profile Layout: Color Stripes version 2.0

Actually, I'd updated the codes a day or two after posting but forgot to put up a notice.

So, if your friends lists and communitiy lists usernames are currently showing up with underlines, you need to replace a single line of code...

</font></td></tr></tbody></table>

with this code:

</font></div></td></tr></tbody></table>

That's it!

Though I know some people are happy the names are showing up with underlines >_> Oye.

Fix for all Bloggish Layouts

I already updated all my Bloggish layout codes, but if you customized them and uploaded them to your own server, then you may notice that when an image is aligned left or right, well, it doesn't align.

Copy/Paste this code to the end:

However, if y'all are just using the URLs to my stylesheets, y'all don't have to do anything - everything has been updated :)

Layout: S2 Bloggish - Showcase

2008-12-15T03:08:38Z

Style: S2 Bloggish (works on Insane Journal, JournalFen and Livejournal!)
Best view: 800px wide and above
Browsers Tested On: Latest versions of IE, Opera and Firefox
Custom Comment Pages: Yes
Navbar: No

Layout : Showcase
(click for live preview)

Features

Designed specifically for icon journals and graphics communities
Insane Journal, JournalFen and LiveJournal compatible
Header + Tags + Links across top to make efficient use of space
Usernames above entry titles for easy reading
Entries centered
Custom comment pages included
Images for the Linkbar included for BOTH entries and comment pages! (Reply/Edit/Track etc.)
Tags in scrollbox
Customizable: change images and colors for background, links, titles etc.!

Instructions for Insane Journal

Go to Customize Journal on insanejournal (here)
Make sure S2 and NOT S1 is selected
Click Save and then go to Look and Feel
Choose "Bloggish" for Layout and "None" for Themes
Click Save and go to Custom Options
Make sure the Layout Type is "Two column (Sidebar on Left)" VERY IMPORTANT
Use layout's "Base Weblog" stylesheet: Yes
Under Custom external stylesheet URL, copy and the following links for external stylesheet URL (Pasting the codes directly will not work):

http://gossymer.com/storage/CSS/showcase.css

You can also have a link list set up as well as tags.

Instructions for Live Journal And JournalFen

Go to Customize Journal on livejournal (here)or on journalfen (here)
Make sure you are on the S2 system!

Under Select a New Theme
Type in Bloggish
Choose the "Unstyled" theme at the end
Choose 2 column (sidebar on LEFT) IMPORTANT
Click Customize Selected Theme

Under Custom CSS
Use layout's "Base Weblog" stylesheet: YES
Copy and paste the following link for Custom external stylesheet URL (Pasting the codes directly will not work)

http://gossymer.com/storage/CSS/showcase.css

You can also set your links list and your tags.

Credits
I use one of grrliz's layouts as a base (Holiday in Vegas @ thefulcrum), with permission. Any bugs you find are due to my tweaking the code till its barely the same anymore >__<

Paste this code into your profile page:

Customization Instructions

If you want to add a header and change colors:

Download the code linked above
Open it in a text editor
Refer to the customization instructions bellow
You MUST upload the code to a web server. I rec awardspace.com
Follow the instructions above for IJ or/and LJ and just change the URL with the stylesheet you uploaded.
Adjust the credits accordingly

To Add Your Header: Find and replace the following link in the code:

http://pics.livejournal.com/gossymer/pic/007746gg

The image you use needs to be 330px wide and 180px high. You can also use the image linked and just add text to it! Just upload the new image and replace the url in the code..

If you want to change colors, do find/replace for the following codes:
The color code for the Brown BACKGROUND is 230c05
The color code for the Pink title color is CC311D
The color code for the Blue username color is 21786C
The color code for the Green link color is 748C08
The color code for the Brown HOVER color is 955719

IMPORTANT: If you change the background color, you need to find and delete the following URL for the background image:
http://pics.livejournal.com/gossymer/pic/007708kx

Modules

To enable the calendar add the following code to the end:

.module-calendar {display: auto !important;}

To disable the tags module, add the following code to the end:

.module-categories { display: none !important;}

To disable the links module, add the following code to the end:

.module-typelist { display: none !important;}

Depending on the number of modules at the top, your header size can be changed:

With any one module, your header can be up to 495px wide
With any two modules, your header can be up to 335px wide
With three modules, your header can be a max of 165px wide

You are free to make any changes - only requirement is to comment and credit. Oh and if you do try to customize it beyond the instructions listed, please refer to s2bloggish and s2_bloggish for help.

Updates
Have updated the code to do a quick fix for a bug. Now, if images are aligned left or right, they align properly and don't force the text to the next line. If you already customized the codes, add this to the end:

★ Feel free to watch noveltybox

Questions & Answers...

2008-12-15T01:10:16Z

It is a community for layouts, icons, banners and profiles by gossymer. Additionally, icon tutorials, css guides and recs to various shiny graphic related stuff may also get posted. Layouts can also be found here on freelayouts and screencaps for various shows can be found at diminishcap

(back to top).

How do I join the community? How can I friend it? Can I friend you?

Membership to the community is closed but all posts are public so feel free to watch instead. If you'd rather just get a notification when a layout is posted, you can always just track the community.

Friending is open for both my personal lj and the comm, though I should probably mention that on my personal lj, I don't do automatic friending back. Check my profile for more info.

(back to top)

Can I use the stuff you share on the community?

The entire purpose of setting up a comm was so that people can easily get access to and use the stuff posted, so yes! Only rules are to comment and credit.

(back to top)

Do I have to credit?

There's nothing I can really do if you don't do it - well, besides message you with a reminder if I ever notice the lack thereof. But that rarely happens and I don't go looking XD Still, credit is appreciated, if simply so others who like the layouts/graphics can find my stuff easily.

(back to top)

How do I credit?

Crediting is quick and easy:

For icons: when uploading them, copy/ past <lj user="gossymer"> @ <lj comm="noveltybox"> into the Comments text box.
For layouts: if you're using them on Livejournal, make sure you at least have Layout from <lj comm="noveltybox"> at the bottom of your bio area of your profile. If on another site such an insanejournal (or any others) it should be something along the lines of Layout from <a href="http://noveltybox.livejournal.com">noveltybox</a>
For all other graphics: A mention and link back in your resources post is sufficient :)

(back to top)

Will you ever get around to responding to my comment(s)?

I realised a long, long time ago that if I were to respond to comments received, I'd never get anything else done. But I appreciate the comments (like mad) and they do get me psyched to keep churning out stuff. I'd probably still do layouts even if there's weren't any acknowledgement, but comments are an added bonus -___- Comments basically cause squeeing and crazy flailing ^^

(back to top)

Will you be accepting affiliates?

Am not sure yet. If I ever decide I want to, I'll probably ask the communities myself if they'd like to affiliate. You can always respond with your comm (since I may not have come across it yet myself) but I don't think I'll be doing open affiliating anytime soon though. I think I should probably focus on getting this community off the ground first >_>

(back to top)

Layout Answers

Can I edit your codes?

Yes! All my layout are freely available for customization! I myself first used absonant's and interlinea's layouts when I started out with CSS in 2006 so I understand if you'd like to play with the codes.

Some of the layouts, like Lines and Express Yourself come with complete guides to help with customization too! Just remember to comment and credit :)

(back to top)

How can I get help to change/fix something?

There are a number of ways a layout can break: sometimes its your browser, resolution or operating system. Sometimes LJ changes the original styles they're based on (in the past this has caused mini user icons to stop working or titles for entries to look weird.) Sometimes there are problems when customizing the layouts.

Each situation can be different and I really don't have the expertise nor the time to whip open firefox everytime to figure out the issue. After the first week or two of posting a layout I stop responding to problems with it. Instead, there are communities with guides and tutorials and you can even make posts on them asking for help. The people there probably have a MUCH better understanding of what happened to your layout. For a list of helpful communities check this post @ mintyapple

I know a lot of other layout makers do provide support but for me it's a trade off. By not providing support, I get to churn out a lot more layouts and graphics instead. I hope this policy doesn't become too much of a hassle for you :(

(back to top)

Can I use your layouts on other sites?

Yes, just comment and follow the crediting instructions for non-lj sites over here

(back to top)

Can I make and share layouts using your codes as a base?

I follow the Creative Commons Attribution-Non Commercial licence policies. You can edit and share the codes on LJ if you:

Do not make money off of the codes
Comment, telling me about it
Credit me in the post where you share the layout AND in the altered CSS sheet
Ask people who use the codes to credit me for the base codes

Just ask me if you have more questions about sharing the codes with others.

(back to top)

What styles do you use?

While Flexible Squares was the first layout I used, it was Smooth Sailing in 2006 that first made me fall in love with CSS - it has a lot more customizability IMO. Later, thanks to weekly contests at freelayouts I decided to branch out and try out Classic, Component, Dear Diary and Opal in mid 2007.

It wasn't until this year that I got around to Bloggish and Expressive/Mixit which are definitely my favorites at the moment. Bloggish 'cause it can be used on the LJ clones like Insanejournal and Expressive because its brilliant when it comes to functionality and customization. Though I can't wait to try Minimalism in future!

I also have a timeline of all past personal layouts made. My current personal lj's layout is on Expressive. The community layout is on Bloggish.

(back to top)

What resolution do you design for?

I try to ensure my layouts work in 800 x 600 resolutions but certain ones, like three column layouts, are usually made with 1024px wide resolutions in mind. Just check each layout for resolution requirements!

(back to top)

What browsers do you test in?

I design my layouts using the Web Developer addon for Firefox and my primary browser is Opera. After getting the layouts to look right in those two browsers, I check IE to make sure things work alright. I'll make sure it doesn't break, especially since most of the web is still on IE, but my layouts are optimized for Firefox and Opera.

(back to top)

There are images in your layouts! Do I need to reupload them?

I got a permanent lj account with LJ this month and all my images are hosted on LJ's scrapbook. They'll never be deleted and its likely that if Scrapbook were to go down, it would be because LJ went down - since that's so rare, y'all can use the images as is. Though if y'all want to host them yourselves, feel free!

(back to top)

I need to upload the CSS sheet to my own server? What? How? Why?

Sometimes the CSS codes can be too long (LJ has a limit to size) and causes errors if pasted directly. Also, some hacks in the CSS (to get linkbar icons to show up in some cases) can throw errors too. So for certain layouts, like those on Bloggish, I request that anyone who decides to customize the layouts should download and then reupload the style sheet(s) onto their own web server. In the past I've used awardspace.com and definitely recommend it.

(back to top)

How do I get rid of ads?

You need to downgrade to a basic account (over here) or buy a paid account. Ads only show up for Plus accounts and for people not logged into LJ.

(back to top)

How do I get rid of the nav bar at the top?

Go here and UNcheck Always show on my journal/community

(back to top)

How do I disable the custom comment pages?

Go here and select YES for Disable customized comment pages for your journal

(back to top)

Credits: The format of this Q&A post is modelled after grrliz's own FAQ ♥

Profile: Monochrome

2008-12-14T02:24:58Z

Did my final profile revamp for a while and here are the codes if anyone is interested.

This version uses one of the Christmas images I shared last year.

No need to specify any width - the tables will stretch according to the width of your browser window, just like the new lj profile.

Also, you are free to edit the profile till it's unrecognizable - do whatever you want with the code.

The only rule is to comment & credit.

Monochrome
click for live preview

Go to Edit Personal Information and paste the code into your Bio

The Code

<TABLE cellSpacing=0 cellPadding=12 align=center  width=auto border=0><TBODY><TR>
<TD VALIGN="center"  width=auto align=left><B><FONT style="LETTER-SPACING: 2px" face="Cambria,Georgia,Palatino Linotype" color=#000000 size=4> ♣  clubs </FONT></B>

<div align="justify"><FONT face="helvetica,arial,tahoma,sans-serif" color=#444444 size=1>Nulla ornare tellus sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Quisque egestas, arcu id ullamcorper molestie, pede felis luctus urna, eget scelerisque nisl lectus ut magna. Maecenas dapibus elementum urna. Vestibulum arcu ipsum, iaculis et, auctor non, suscipit eu, purus. Phasellus iaculis vehicula diam.

Pellentesque eleifend, quam in fermentum fringilla, libero magna imperdiet nisi, id cursus urna mauris ac eros.
</FONT></div></TD>
<TD rowSpan=2 cellPadding=0 VALIGN="center" width=auto align=center><center><img src="http://pics.livejournal.com/gossymer/pic/0076c6ye"></center></TD><TD VALIGN="center" width=auto align=right><B><FONT style="LETTER-SPACING: 2px" face="Cambria,Georgia,Palatino Linotype" color=#000000 size=4>diamonds  ♦   </FONT></B>

<div align="justify"><FONT face="helvetica,arial,tahoma,sans-serif" color=#444444 size=1>Proin auctor augue quis mi semper molestie.

Nam egestas lobortis elit. Phasellus quam. Praesent eu dui vitae felis laoreet lacinia. Vivamus urna neque, blandit nec, sollicitudin at, tristique id, diam. Nullam tempor viverra sem. Aenean nec tellus ut felis ullamcorper ullamcorper.

<div align="justify"><FONT face="helvetica,arial,tahoma,sans-serif" color=#444444 size=1>Vestibulum et urna. Suspendisse sed dui faucibus libero aliquet feugiat. Donec pede mauris, pretium sit amet, feugiat eu, ultrices ut, orci.

In in erat id risus auctor blandit. Donec neque. Sed interdum porta mauris. Proin eget erat ac mauris facilisis mollis. Cras dignissim felis in sapien. Ut ac odio in sapien rutrum posuere.

Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.
</FONT></div></TD>
<TD VALIGN="center" align=right><B><FONT style="LETTER-SPACING: 2px" face="Cambria,Georgia,Palatino Linotype" color=#000000 size=4>spades   ♠  </FONT></B>

<div align="justify"><FONT face="helvetica,arial,tahoma,sans-serif" color=#444444 size=1>Aliquam at nulla. Nam lacus nulla, pretium et, fringilla id, porta vel, odio. Suspendisse ut nulla. Integer sagittis, orci at tincidunt fermentum, nisl velit hendrerit libero, in pulvinar velit nisi ac quam.

Aenean id elit. Nulla mi neque, posuere ut, mattis id, euismod at, lorem. Suspendisse nisi urna, semper quis, eleifend a, ultrices id, sem. Donec felis quam, feugiat vitae, dignissim et, dictum in, turpis.

Sed sapien. Integer ante ante, faucibus vel, pellentesque in, tincidunt ut, magna.
</FONT></div></TD></TR>
<TR><TD BGcolor=#010101 VALIGN="center" align=center><div align="justify"><FONT face=arial color=#cccccc size=1>  <A href="URL"><font color="#c0c0c0">LINK</A></font> | <a href="URL"><font color="#c0c0c0">LINK</font></a> | <a href="URL"><font color="#c0c0c0">LINK</font></a>  </div></FONT></TD>
<TD BGcolor=#010101 VALIGN="center" align=center></TD>
<TD BGcolor=#010101 VALIGN="center"  align=right><div align="RIGHT"><FONT face=arial color=#cccccc size=1>  <A href="URL"><font color="#c0c0c0">link</font></A> | <A href="URL"><font color="#c0c0c0">link</font></A> | <A href="URL"><font color="#c0c0c0">link</font></A> | <A href="http://gossymer.livejournal.com/tag/layout"><font color="#c0c0c0">profile codes</font></A>     </FONT></div></TD></TR></TBODY></TABLE>

You can do Edit/Find/Replace all to change all the colors and the image

Header Title Color code: 000000
Regular Text Color Code: 444444
Background Color for the bottom bar: 010101
Text color for bottom bar: cccccc
Link color for bottom bar: c0c0c0

Image URL: http://pics.livejournal.com/gossymer/pic/0076c6ye
If you decide to change the image, choose something around 300px wide!

★ Feel free to watch noveltybox

Fixing the Entry Title link format

2008-12-14T02:24:18Z

If you're not using an Expressive/Mixit layout (Edit: or the default component layouts), chances are your entry titles no longer look quite right since Livejournal just changed the layouts to display entry titles as links.

This applies to my shared layouts too. So here's the CSS override needed to change the title link format in the layouts.

Bloggish

.entry h3.entry-header a {
color: #Y !important;
font-size: # !important;
font-family: % !important;
text-decoration: none !important;
font-weight: bold !important;
}

Classic

.subject a {
color: #Y !important;
font-size: # !important;
font-family: % !important;
text-decoration: none !important;
font-weight: bold !important;
}

Component

.entryHeader a {
color: #Y !important;
font-size: # !important;
font-family: % !important;
text-decoration: none !important;
font-weight: bold !important;
}

Dear Diary

.entryheader h3 a {
color: #Y !important;
font-size: # !important;
font-family: % !important;
text-decoration: none !important;
font-weight: bold !important;
}

Flexible Squares

.subject a {
color: #Y !important;
font-size: # !important;
font-family: % !important;
text-decoration: none !important;
font-weight: bold !important;
}

Smooth Sailing

.entryHeaderSubject a {
color: #Y !important;
font-size: # !important;
font-family: % !important;
text-decoration: none !important;
font-weight: bold !important;
}

Instructions

Go to the Custom CSS area
Copy/paste the needed code in the "Custom Stylesheet" area, AFTER all the existing code.
In the code pasted, replace:
Y with your color code
# for font size (remember to add pt or px or % or em after the number)
% with the font name(s)
If you don't want the title in bold, change the 'bold' for font-weight to normal. And if you want the title underlined, for text-decoration change 'none' to underline

Note: Just delete the lines you don't need (such as font-family or font-size) if you only want to change one or two things.

Layout: S2 Bloggish - Desktop

2008-12-14T02:23:22Z

Style: S2 Bloggish (works on Insane Journal, JournalFen and Livejournal!)
Best view: 1024px and 1280px wide and above
Browsers Tested On: Latest versions of IE, Opera and Firefox
Custom Comment Pages: Yes
Navbar: No

Layout : Desktop

Preview:With Images // Wood Image Only

Features

Insane Journal, JournalFen and LiveJournal compatible
Two Column Design -sidebar on left
Usernames above entry titles for easy reading
Entries centered
Custom comment pages included
Images for the Linkbar included! (Reply/Edit/Track etc.)
Tags in scrollbox
With or without background images!

Instructions for Insane Journal

Go to Customize Journal on insanejournal (here)
Make sure S2 and NOT S1 is selected
Click Save and then go to Look and Feel
Choose "Bloggish" for Layout and "None" for Themes
Click Save and go to Custom Options
Make sure the Layout Type is "Two column (Sidebar on Left)" VERY IMPORTANT
Use layout's "Base Weblog" stylesheet: Yes
Under Custom external stylesheet URL, copy and paste one of the following links for external stylesheet URL (Pasting the codes directly will not work):

For default version (with images):
http://gossymer.com/storage/CSS/note.css

For Wood background image only version:
http://gossymer.com/storage/CSS/blanknote.css

You can also have a link list set up as well as tags.

Instructions for Live Journal And JournalFen

Go to Customize Journal on livejournal (here)or on journalfen (here)
Make sure you are on the S2 system!

Under Select a New Theme
Type in Bloggish
Choose the "Unstyled" theme at the end
Choose 2 column (sidebar on LEFT) IMPORTANT
Click Customize Selected Theme

Under Custom CSS
Use layout's "Base Weblog" stylesheet: YES
Copy and paste one of the following links for Custom external stylesheet URL (Pasting the codes directly will not work)

For default version (with images):
http://gossymer.com/storage/CSS/note.css

For Wood background image only version:
http://gossymer.com/storage/CSS/blanknote.css

You can also set your links list and your tags.

Credits
I use one of grrliz's layouts as a base (Holiday in Vegas @ thefulcrum), with permission. Any bugs you find are due to my tweaking the code till its barely the same anymore >__<

Paste this code into your profile page:

You are free to make any changes - only requirement is to comment and credit. If you do decide to edit the CSS, you will need to upload the new code to your own server - I recommend awardspace.com

Note: If you want to remove the header/title, this is the code needed:

#banner {display:none;}

#container-inner {padding-top: 200px;}

#beta {
margin-top: -140px !important;
border: 3px double #dfdfdf !important;}

If this is for the No Image version, change the margin-top and passing-top value to 0.

You might be able to add it to the "Custom Stylesheet" textarea as an over ride but if that doesn't work, you'll need to download, edit and reupload the style sheet.

Oh and if you do try to customize it beyond the instructions listed, please refer to s2bloggish and s2_bloggish for help.

★ Feel free to watch noveltybox

Layout: S2 Bloggish - Stripes

2008-12-14T02:22:48Z

Style: S2 Bloggish (works on Insane Journal, JournalFen and Livejournal!)
Best view: 800px wide and above
Browsers Tested On: Latest versions of IE, Opera and Firefox
Custom Comment Pages: Yes
Navbar: Yes

Layout : Stripes

Live Preview

Features

Insane Journal, JournalFen and LiveJournal compatible
Two Column Design -sidebar on left
Usernames above entry titles for easy reading
Will work on free layouts
Custom comment pages included
Images for the Linkbar included! (Reply/Edit/Track etc.)
Tags in scrollbox
With or without navstrip
You can also add a header or change the link colors and entry title colors :)

Instructions for Insane Journal

Go to Customize Journal on insanejournal (here)
Make sure S2 and NOT S1 is selected
Click Save and then go to Look and Feel
Choose "Bloggish" for Layout and "None" for Themes
Click Save and go to Custom Options
Make sure the Layout Type is "Two column (Sidebar on Left)" VERY IMPORTANT
Use layout's "Base Weblog" stylesheet: Yes
Under Custom external stylesheet URL, copy and paste this URL:

http://gossymer.com/storage/CSS/stripes_nonav.css

You can also have a link list set up as well as tags.

Instructions for Live Journal And JournalFen

Go to Customize Journal on livejournal (here)or on journalfen (here)
Make sure you are on the S2 system!

Under Select a New Theme
Type in Bloggish
Choose the "Unstyled" theme at the end
Choose 2 column (sidebar on LEFT) IMPORTANT
Click Customize Selected Theme

Under Custom CSS
Use layout's "Base Weblog" stylesheet: YES
Copy and paste one of the following links for Custom external stylesheet URL (Pasting the codes directly will not work)

The version with the minimalist navstrip at the top:
http://gossymer.com/storage/CSS/stripes.css

Without the navstrip (compatible with Journal Fen!)
http://gossymer.com/storage/CSS/stripes_nonav.css

NOTE: If you chose the navstrip version go here and make sure you selected the Light gray gradient.

You can also set your links list and your tags.

Credits
I use one of grrliz's layouts as a base (Holiday in Vegas @ thefulcrum), with permission. Any bugs you find are due to my tweaking the code till its barely the same anymore >__<

Paste this code into your profile page:

Customization Instructions

If you want to add a header and change colors

Download the code linked above
Open it in a text editor
Refer to the customization instructions bellow
You MUST upload the code to a web server. I use awardspace myself.
Follow the instructions above for IJ or/and LJ and just change the URL with the stylesheet you uploaded.
Adjust the credits accordingly

To Add Your Header: Scroll to the bottom of the code and replace XXX with your image URL and 0px with the height of your image plus 20px. e.g. so if your image is 150px in height, type in 170px.

NOTE: Header should be a 760px wide

If you want to change colors, do find/replace for the following codes:

The color code for the Pink is #C12B30
The color code for the Blue is #006382

If you want to change the colorstrip, you need to change the replace this image.

One example of a customized layout is here.

You are free to make any changes - only requirement is to comment and credit. Oh and if you do try to customize it beyond the instructions listed, please refer to s2bloggish and s2_bloggish for help.

★ Feel free to watch noveltybox

Active Layout Makers

2008-12-14T02:22:14Z

If I need a layout for comms or anything, I head over to thefulcrum (layouts by grrliz). Most people are familiar with it, but if you somehow managed to miss it, this is the community to friend (or track or add to feeds, lol). Whether it be smooth sailing or bloggish or expressive, the variety of layouts is second to none.

Layout Picks: 1 | 2 | 3 (just picked from the first page, 'cause there is SO much awesome)

fruitstyle (layouts by malionette) is a favorite out of the newer active layout makers because unlike 99% of them, the comm has layouts on smooth sailing, opal as well as the ubiquitous flexible squares. No sticking to one S2 style.

Layout Picks: 1 | 2 | 3

spire (layouts by daemon) is another favorite - in this case, I see the layout, go "shiny!" and then notice the username. Also does layouts with a number of s2 styles ^_^

Layout Picks: 1 | 2 | 3 | 4

minty_peach (layouts by miiiintz) is THE flexisquares layout maker IMO. If you've seen her stuff, then you've probably seen what most FS layouts look like. Insanely popular comm.

Layout Picks: 1 | 2 | 3 | 4 | 5

Single Picks from other active layout makers - who focus on flexible squares and in one or two cases, smooth sailing.

allwashedout [ PICK ]
novaless [ PICK ]
refuted [ PICK ]
toyhouse [ PICK ]
refutare [ PICK ]
milou_veronica [ PICK ]
biconic [ PICK ]

It's worth checking mintyapple and freelayouts periodically to find fresh stuff. There are a lot of layout makers out there.

Profiles: Minimalism, Color Stripes v3 &v4

2008-12-14T02:21:38Z

The tables will stretch according to the width of your browser window, just like the new lj profile.

You are free to edit the codes till they're unrecognizable. Add an image or two, reduce the number of columns - do whatever y'all want to the code.

Only rule is to comment & credit.

Note: Color Stripes version 2 is here and version 1 is here

Color Stripes v3.0
click for live preview

Go to Edit Personal Information and paste the code into your Bio

The Code

<TABLE cellSpacing=8 cellPadding=2 align=center width=100% border=0>
<TBODY>
<TR>
<TD bgColor=#30afbf width=20%></TD><TD bgColor=#a8cc33 width=20%></TD><TD bgColor=#f2bd1d width=20%></TD><TD bgColor=#df7d1b width=20%></TD><TD bgColor=#cc3c18 width=20%></TD></TR>
<TR>
<TD VALIGN="top" bgColor=#ffffff><div align="right"><B><FONT style="letter-spacing: 2px" face="Cambria,Georgia,Palatino Linotype" color=#30afbf size=4><i>first title </i></FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,tahoma,sans-serif" color=#555555 size=1>Nulla ornare tellus sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Pellentesque eleifend, quam in fermentum fringilla, libero magna imperdiet nisi, id cursus urna mauris ac eros.</FONT></P></div></TD><TD VALIGN="top" bgColor=#ffffff><div align="right"><B><FONT style="letter-spacing: 2px" face="Cambria,Georgia,Palatino Linotype" color=#a8cc33 size=4><i>second title </i></FONT></B></div><div align="justify"><P><FONT face=arial color=#555555 size=1>Proin auctor augue quis mi semper molestie.

Mauris vitae dolor vitae sapien ultricies sagittis. Aliquam tempus arcu ac nisi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</FONT></P></div></TD><TD VALIGN="top" bgColor=#ffffff><div align="right"><B><FONT style="letter-spacing: 2px" face="Cambria,Georgia,Palatino Linotype" color=#f2bd1d size=4><i>third title </i></FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,tahoma,sans-serif" color=#555555 size=1>Vestibulum et urna. Suspendisse sed dui faucibus libero aliquet feugiat. Donec pede mauris, pretium sit amet, feugiat eu, ultrices ut, orci.

In in erat id risus auctor blandit. Donec neque. Sed interdum porta mauris. Proin eget erat ac mauris facilisis mollis. Cras dignissim felis in sapien. Ut ac odio in sapien rutrum posuere.

Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.</FONT></P></div></TD><TD VALIGN="top" bgColor=#ffffff><div align="right"><B><FONT style="letter-spacing: 2px" face="Cambria,Georgia,Palatino Linotype" color=#df7d1b size=4><i>fourth title </i></FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,Tahoma,sans-serif" color=#555555 size=1>Aliquam at nulla. Nam lacus nulla, pretium et, fringilla id, porta vel, odio. Suspendisse ut nulla. Integer sagittis, orci at tincidunt fermentum, nisl velit hendrerit libero, in pulvinar velit nisi ac quam.

Sed sapien. Integer ante ante, faucibus vel, pellentesque in, tincidunt ut, magna.</FONT></P></div></TD><TD VALIGN="top" bgColor=#ffffff><div align="right"><B><FONT style="letter-spacing: 2px" face="Cambria,Georgia,Palatino Linotype" color=#cc3c18 size=4><I>fifth title </I></B></div><div align="justify"><P><FONT face=arial color=#555555 size=1>Ut ac odio in sapien rutrum posuere. Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.

Aliquam interdum ante at augue. Fusce ac leo vitae justo commodo vulputate. Aliquam eu enim et diam adipiscing lobortis. Suspendisse sed dui faucibus libero aliquet feugiat. </P><P><FONT face=arial color=#555555 size=1><A href="http://gossymer.livejournal.com">C R E D I T S</A></P></div></FONT></TD></TR><tr><td bgcolor="#30afbf" width="20%"></td><td bgcolor="#a8cc33" width="20%"></td><td bgcolor="#f2bd1d" width="20%"></td><td bgcolor="#DF7D1B" width="20%"></td><td bgcolor="#cc3c18" width="20%"></td></tr></TBODY></TABLE>

You can do Edit/Find/Replace all to change all the colors

Background Color code: #ffffff
Regular Text Color Code: #555555

Stripe/Title colors
Box #1: Blue - #30afbf
Box #2: Green - #a8cc33
Box #3: Yellow #f2bd1d
Box #4: Orange - #df7d1b
Box #5: Red - #cc3c18

Color Stripes v4.0
click for live preview

Go to Edit Personal Information and paste the code into your Bio

The Code

<table class="lj_pollanswer_loading" bgColor=#ffffff cellpadding=0 cellspacing=0><TR><TD><TABLE cellSpacing=8 cellPadding=2 align=center width=100% border=0><TBODY><TR><TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 1</FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,tahoma,sans-serif" color=#555555 size=1>Nulla ornare tellus sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Pellentesque eleifend, quam in fermentum fringilla, libero magna imperdiet nisi, id cursus urna mauris ac eros.</FONT></P></div></TD>
<TD bgColor=#30afbf></TD>
<TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 2</FONT></B></div><div align="justify"><P><FONT face=arial color=#555555 size=1>Proin auctor augue quis mi semper molestie.

Mauris vitae dolor vitae sapien ultricies sagittis. Aliquam tempus arcu ac nisi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</FONT></P></div></TD>
<TD bgColor=#a8cc33></TD>
<TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 3</FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,tahoma,sans-serif" color=#555555 size=1>Vestibulum et urna. Suspendisse sed dui faucibus libero aliquet feugiat. Donec pede mauris, pretium sit amet, feugiat eu, ultrices ut, orci.

In in erat id risus auctor blandit. Donec neque. Sed interdum porta mauris. Proin eget erat ac mauris facilisis mollis. Cras dignissim felis in sapien. Ut ac odio in sapien rutrum posuere.

Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.</FONT></P></div></TD>
<TD bgColor=#f2bd1d></TD>
<TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 4</FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,Tahoma,sans-serif" color=#555555 size=1>Aliquam at nulla. Nam lacus nulla, pretium et, fringilla id, porta vel, odio. Suspendisse ut nulla. Integer sagittis, orci at tincidunt fermentum, nisl velit hendrerit libero, in pulvinar velit nisi ac quam.

Sed sapien. Integer ante ante, faucibus vel, pellentesque in, tincidunt ut, magna.</FONT></P></div></TD>
<TD bgColor=#D63F0E></TD><TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 5</FONT></B></div><div align="justify"><P><FONT face=arial color=#555555 size=1>Ut ac odio in sapien rutrum posuere. Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.

You can do Edit/Find/Replace all to change all the colors

Background Color code: #ffffff
Title Color Code: #666666
Regular Text Color Code: #555555

Stripe colors
Stripe #1: Blue - #30afbf
Stripe #2: Green - #a8cc33
Stripe #3: Yellow #f2bd1d
Stripe #4: Scarlet - #D63F0E

Minimalism
click for live preview

Go to Edit Personal Information and paste the code into your Bio

The Code

<table class="lj_pollanswer_loading" bgColor=#fafafa cellpadding=0 cellspacing=0><TR><TD><TABLE cellSpacing=0 cellPadding=12 align=center width=100% border=0><TBODY><TR><TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 1</FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,tahoma,sans-serif" color=#555555 size=1>Nulla ornare tellus sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Pellentesque eleifend, quam in fermentum fringilla, libero magna imperdiet nisi, id cursus urna mauris ac eros.</FONT></P></div></TD>
<TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 2</FONT></B></div><div align="justify"><P><FONT face=arial color=#555555 size=1>Proin auctor augue quis mi semper molestie.

Mauris vitae dolor vitae sapien ultricies sagittis. Aliquam tempus arcu ac nisi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</FONT></P></div></TD>
<TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 3</FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,tahoma,sans-serif" color=#555555 size=1>Vestibulum et urna. Suspendisse sed dui faucibus libero aliquet feugiat. Donec pede mauris, pretium sit amet, feugiat eu, ultrices ut, orci.

In in erat id risus auctor blandit. Donec neque. Sed interdum porta mauris. Proin eget erat ac mauris facilisis mollis. Cras dignissim felis in sapien. Ut ac odio in sapien rutrum posuere.

Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.</FONT></P></div></TD>
<TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 4</FONT></B></div><div align="justify"><P><FONT face="helvetica,arial,Tahoma,sans-serif" color=#555555 size=1>Aliquam at nulla. Nam lacus nulla, pretium et, fringilla id, porta vel, odio. Suspendisse ut nulla. Integer sagittis, orci at tincidunt fermentum, nisl velit hendrerit libero, in pulvinar velit nisi ac quam.

Sed sapien. Integer ante ante, faucibus vel, pellentesque in, tincidunt ut, magna.</FONT></P></div></TD><TD VALIGN="top" width="20%"><div align="center"><B><FONT face="Cambria,Georgia,Palatino Linotype" color=#666666 size=4>TITLE 5</FONT></B></div><div align="justify"><P><FONT face=arial color=#555555 size=1>Ut ac odio in sapien rutrum posuere. Quisque molestie. Sed urna magna, euismod sit amet, ornare nec, tincidunt ut, lorem.

You can do Edit/Find/Replace all to change all the colors

Background Color code: #fafafa
Title Color Code: #666666
Regular Text Color Code: #555555

★ Feel free to watch noveltybox

Profile Layout: Color Stripes v2.0

2008-12-14T02:20:37Z

Profile Style: Color Stripes v2.0

Revamped my bio to match the new LJ profile XD

Preview (click for live preview )

The table will stretch according to the width of your browser window, just like the profile \o/

Go to Edit Personal Information and paste the code into your Bio

The Code

<TABLE cellSpacing=4 cellPadding=8 align=center width=100% border=0>
<TBODY>
<TR>
<TD VALIGN="center" bgColor=#30afbf width=20% align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#ffffff size=4 Roman New>first title   ♦ </FONT></B></TD>
<TD VALIGN="center" bgColor=#a8cc33 width=20% align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#ffffff size=4 Roman New>second title   ♣  </FONT></B></TD>
<TD VALIGN="center" bgColor=#f2bd1d width=20% align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#ffffff size=4 Roman New>third title   ♥  </FONT></B></TD>
<TD VALIGN="center" bgColor=#DF7D1B width=20% align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#ffffff size=4 Roman New>fourth title   ♠ </FONT></B></TD>
<TD VALIGN="center" bgColor=#cc3c18 width=20% align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#ffffff size=4 Roman New>fifth title</FONT>   <FONT color=#ffffff>★ </FONT></B></TD></TR>
<TR>
<TD rowspan=2 VALIGN="top" bgColor=#fafafa><div align="justify"><FONT face=Arial color=#555555 size=1>First - Praesent nibh eros, vulputate ut, vestibulum eu, lacinia ut, orci. Sed eget dui non pede consectetuer tempus. Phasellus malesuada, metus nec porttitor faucibus, justo metus dapibus eros, id ullamcorper metus sem ut dui.</div></TD>
<TD rowspan=2 VALIGN="top" bgColor=#fafafa><div align="justify"><FONT face=Arial color=#555555 size=1>Second - Praesent nibh eros, vulputate ut, vestibulum eu, lacinia ut, orci. Sed eget dui non pede consectetuer tempus. Phasellus malesuada, metus nec porttitor faucibus, justo metus dapibus eros, id ullamcorper metus sem ut dui.</FONT></div></TD>
<TD rowspan="2" VALIGN="top" bgColor=#fafafa><div align="justify"><FONT face=Arial color=#555555 size=1>Third - Praesent nibh eros, vulputate ut, vestibulum eu, lacinia ut, orci. Sed eget dui non pede consectetuer tempus. Phasellus malesuada, metus nec porttitor faucibus, justo metus dapibus eros, id ullamcorper metus sem ut dui.</FONT></div></TD>
<TD rowspan=2 VALIGN="top" bgColor=#fafafa><div align="justify"><FONT face=Arial color=#555555 size=1>Fourth - Praesent nibh eros, vulputate ut, vestibulum eu, lacinia ut, orci. Sed eget dui non pede consectetuer tempus. Phasellus malesuada, metus nec porttitor faucibus, justo metus dapibus eros, id ullamcorper metus sem ut dui.</FONT></div></TD>
<TD VALIGN="top" bgColor=#fafafa><div align="justify"><FONT face=Arial color=#555555 size=1>Fifth - Praesent nibh eros, vulputate ut, vestibulum eu, lacinia ut, orci. Sed eget dui non pede consectetuer tempus. Phasellus malesuada, metus nec porttitor faucibus, justo metus dapibus eros, id ullamcorper metus sem ut dui.</div></FONT></TD></TR><TR> <TD VALIGN="bottom" bgColor=#fafafa><div align="RIGHT"><FONT face=Arial color=#555555 size=-2><A href="http://gossymer.livejournal.com">C R E D I T S</A></FONT></div></TD></TR></TBODY></TABLE>

You can do Edit/Find/Replace all to change all the colors

Text Background Color code: #fafafa
Heading Text Color Code: #ffffff
Regular Text Color Code: #555555

Stripe Color Codes
Box #1: Blue - #30afbf
Box #2: Green - #a8cc33
Box #3: Yellow #f2bd1d
Box #4: Orange - #DF7D1B
Box #5: Red - #cc3c18

You are free to edit the codes - only rule is to comment and credit!

★ Feel free to watch noveltybox

Icon comms

2008-12-14T02:19:16Z

Since I got rid of my icon communities from default view and switched them to my icons filter, I've found I could handle more comms and so this week I've added the following anime!icon comms:

baking (okay, I just followed parle & eliminate from kyoukatabira)
berunkasuteru
cereal_killerz
heygraphics
seaverse
polyesters
ramudaderuta
robotsex
shingetsuu
toyplanet

One or two are on a trial run and I may drop after a while but \o/ I'm constantly surprised by how many anime!icon makers don't join elite comms - makes it harder to find them >_<

Am also tracking their 'requests' tag so that I get an email whenever requests go up...which is what just happened with shingetsuu *evil laugh*

Other icon comms I'm watching:

bubblemilk | disneytastic | estheticons | goodstockicons | halare | hip_animanga | iconnaissances | limbslikewire | onlydreamers | scifi_exclusive | sgc_elite | sundry_icons | takenote_icons | weapon_icons | whoresque | yarinige

That will hopefully be the last icon!post I make for a while so y'all can breath a sigh of relief XD

Terminus Badges & HP Icons

2008-12-14T02:18:29Z

I did some super last minute badges for Terminus. If anyone is interested in them, they can get them off of Zazzle over here.

Each badge/button can be as small as 1inch or even 4 inches big - and either square or round :)

I also made most of the them into icons for use on lj too :)

Previews


[ 01 - 04]

[ 04 - 08]

[ 09 - 12]

[ 13 - 16]

[ 17 - 19]

Note: Please credit miinty_sticks for the art in #18.

Rules: credit is needed and comments just make me squee ^__^

★ Feel free to watch noveltybox

Favorite Icon Makers Showcase

2008-12-14T02:17:49Z

Am stuck using random wireless networks, if and when they appear in the area. Am limited to checking email most of the time. BUT, this means I have more time to spend on cleaning, doing icons and catching up on stuff I was supposed to do for a while :) Speaking of which:

FAVORITE ICON MAKER SHOWCASE

MY TOP TEN

Icons @ iconnaissances

Awesome use of text - some of the funniest avatar icons on LJ, IMO and the icons also happen to be pretty fabulous in terms of color, crop etc.

E X A M P L E S

Icons @ limbslikewire

Fantastic disney icons over here. Absolutely HUGE batches of icons, and a lot of variety when it comes to fandoms.

E X A M P L E S

Icons @ mowd_icons

Lovely coloring on icons and there are usually quite a few choices in each post (when it comes to fandoms, icon styles etc.)

E X A M P L E S

Icons by phuck @ last5

Usually needs no introduction as his icons are Quality stuff. Think I first saw the icons in 2006 and the clarity and depth of colors still leaves me *_* today.

E X A M P L E S

Icons @ sundry_icons

Probably the BEST coloring of anime/cartoon icons on livejournal. The colors look natural and incredibly vibrant and it seems so effortless - which it definitely ISN'T. Fantastic work with every post.

E X A M P L E S



Icons @ weapon_icons

One of my earliest discoveries - everything from anime to tv shows to movies to stock to celebrities. myrasis has her favorites fandoms but that doesn't stop her from trying new things and being genuinely creative.

E X A M P L E S

Icons @ whoresque

Another great spot for anime and cartoon icons that happens to include some AMAZING text icons too.

E X A M P L E S

Icons @ estheticons

My current favorite clique!anime-icon community. There are three icons makers and each has a unique style. Love the vibrant colors.

E X A M P L E S

Icons @ bubblemilk

Probably my most recent discovery when it comes to clique!coms. The icons in general are clear and the colors are neither dull nor super vibrant - especially kamina's. They are just...very easy on the eyes :) The cropping also works for me :)

E X A M P L E S


Icons @ kyoukatabira

One of the earliest clique!anime-icon communities I stumbled across. I don't always find fandoms of interest here, but when I do, I tend to squee. Colors tend to be far more muted too.

E X A M P L E S

Layout: S2 Flexible Squares - Dual

2008-12-14T02:15:55Z

Style: S2 Flexible Squares
Best view: optimized for 1024px wide
Browsers Tested On: Latest versions of IE, Opera and Firefox only
Navbar:Works with AND without it!
Custom Comment Pages: Yes!

Layout : Dual

Live Previews:
Without navstrip & a full length sidebar: HERE
With minimalist navstrip and custom header @ terminus_hd

Features

Fluid/stretchable layout which is easily changed to fixed width!
Perfectly centralized entries
Userpics on the left BUT they do not get in the way of the entry posts
Custom comment pages included
Tags in scrollbox
With or without navstrip
You can also add a header or change the colors (blue & green)

Instructions
Go to the layout customization area
NOTE: Your title should be under 32 characters!

Under Select a New Theme
Type in Flexible Squares
Choose any colorscheme click Apply Theme
Choose 2 column (sidebar on right)
Click Customize Selected Theme

Under Customize Options
You can choose to enable or disable the navstrip
Disable customized comment pages for your journal: No
Set the user picture position for each entry: Left
Click Save Changes

Under Text
Text used to link to the 'Recent Entries' view: Entries
Text used to link to the 'User Information' view: Profile
(Basically change the text to something short)

Under Custom CSS
Use layout's stylesheet(s): Yes
Use layout's stylesheet(s) when including custom external stylesheet: No
Use external stylesheets: Yes
Copy and paste one of the following links for Custom external stylesheet URL (Pasting the codes directly may not work)
http://gossymer.com/storage/CSS/dual.css

Paste this code into your profile page:

Customization Instructions
If you want to make any customizations

Download the code linked above
Open it in a text editor
Refer to the customization instructions bellow
I recommend you upload the code to a web server. I use awardspace myself.
Follow the instructions above to set up the layout and just change the URL with the stylesheet you uploaded.
You are free to make any changes as long as you comment and credit for the base codes

TO CHANGE COLORS

If you want to change colors, do find/replace for the following codes:

Blue links are #007ba7
Green titles and lj user links are #73AD10
Green sidebar titles and header border are #80c020

TO ADD A HEADER
Add the following code to the end:

.title {
display: none;
}

    #header {
background: url(YOUR URL HERE) no-repeat top center;
background-color: #202020; /* your header image background color */
border-bottom: 7px solid #007ba7 !important; /* to remove border change the px to 0 */
border-top: 7px solid #80c020 !important; /* to remove border change the px to 0 */
height: 200px !important; /* change to the height of your image */
        }

.navheader {
top: 207px; /*This number must be 7px more than the height of your header image*/
}

.skiplinks {
top: 300px; /* This number should be 100px more than the navheader value for top */
}

CHANGING FROM FLUID/STRETCHABLE TO FIXED WIDTH LAYOUT

Note: If you want to have a custom header image with this, you will need a header image which is 62% of your max-width. So if your max width is 1024px, your header would be 635px wide.

body {
max-width: 1024px; /* change to your maximum width */
margin: 0px auto;
}

#header {
padding: 0px !important;
margin: 0px 19%!important;
background: url(YOUR URL HERE) no-repeat center; 
height: 238px !important; /* your image height */
background-color: #202020; /*your header background color*/
}

.navheader {
top: 200px; /*This number must be 38px less than the height of your header image*/
}

.title {
margin: 0px auto !important;
padding-top: 100px !important; /* This number should be half of the top value for navheader */
display: !none; /* If you have a header image and do NOT want the title delete the ! before none */
}

.skiplinks {
top: 300px; /* This number should be 100px more than the navheader value for top */
}

You are free to make any changes - only requirement is to comment and credit. Oh and if you do try to customize it beyond the instructions listed, please refer to s2flexisquares for help.

★ Feel free to watch noveltybox

Layout: S2 Bloggish - Celebration

2008-12-14T02:14:36Z

Style: S2 Bloggish (works on Insane Journal, JournalFen and Livejournal!)
Best view: minimum of 1024px wide
Browsers Tested On: Latest versions of IE, Opera and Firefox only
Custom Comment Pages: Yes
Navbar: Yes

Layout : Celebration

Live Preview @ LiveJournal or InsaneJournal!
Live Preview with fixed sideheader: hd_holidays

Features

Insane Journal, JournalFen and Live Journal compatible
Perfectly centralized entries
Three Column Design
Usernames above entry titles for easy reading
Will work on free layouts
Custom comment pages included
Images for the Linkbar included! (Reply/Edit/Track etc.)
Tags in scrollbox
With or without navstrip
You can also add a sideheader or change the link colors and entry title colors :)

Instructions for Insane Journal

Go to Customize Journal on insanejournal (here)
Make sure S2 and NOT S1 is selected
Click Save and then go to Look and Feel
Choose "Bloggish" for Layout and "None" for Themes
Click Save and go to Custom Options
Make sure the Layout Type is "Two column (Sidebar on Left)" VERY IMPORTANT
Use layout's "Base Weblog" stylesheet: Yes
Under Custom external stylesheet URL, copy and paste this URL:
http://gossymer.com/storage/CSS/celeb_nonav.css

You can also have a link list set up as well as tags.

Instructions for Live Journal And JournalFen

Go to Customize Journal on livejournal (here)or on journalfen (here)
Make sure you are on the S2 system!

Under Select a New Theme
Type in Bloggish
Choose the "Unstyled" theme at the end
Choose 2 column (sidebar on LEFT) IMPORTANT
Click Customize Selected Theme

Under Custom CSS
Use layout's "Base Weblog" stylesheet: YES
Copy and paste one of the following links for Custom external stylesheet URL (Pasting the codes directly will not work)

The version with the minimalist navstrup at the top:
http://gossymer.com/storage/CSS/celeb_nav.css

Without the navstrip (compatible with Journal Fen!)
http://gossymer.com/storage/CSS/celeb_nonav.css

You can also set your links list and your tags.

Credits
I could not find a decent starter sheet for Bloggish so I asked grrliz and used one of hers layouts as a base (Holiday in Vegas @ thefulcrum)- any bugs you find are due to my tweaking the code till its barely the same anymore >__<

Paste this code into your profile page:

Customization Instructions
If you want to add a header and change colors

Download the code linked above
Open it in a text editor
Refer to the customization instructions bellow
You MUST upload the code to a web server. I use awardspace myself.
Follow the instructions above for IJ or/and LJ and just change the URL with the stylesheet you uploaded.
Adjust the credits accordingly

To Add Your Sideheader

NOTE: Sideheader can be a max of 200px wide

OPTION #1:
For a FIXED SIDE HEADER which will stay visible even when you scroll (like hd_holidays), add the following code:

#banner-inner { 
background-image: url(YOUR IMAGE HERE);
background-repeat: no-repeat;  /*you can change to repeat or repeat-x or repeat-y */
background-position: bottom center; /* change to WHATEVER placement you want */
}

OR OPTION #2:
For a REGULAR SIDEHEADER which you can scroll AWAY from, input the following code:

#container-inner {
background-image: url(YOUR URL HERE);
background-repeat: no-repeat; 
background-position: top right; /* only other alternatives are bottom right or center right*/
}

If you want to change colors, do find/replace for the following codes:

Teal links are #008782
Red titles are #b71e00
Blue ljuser links are #176898

You are free to make any changes - only requirement is to comment and credit. Oh and if you do try to customize it beyond the instructions listed, please refer to s2bloggish and s2_bloggish for help.

★ Feel free to watch noveltybox

Profile Layout: Color Stripes

2008-12-14T02:13:56Z

Preview (click for full size version)

Just revamped my user info layout and thought I'd share the code...

Go to Edit Personal Information and paste the code into your Bio

The Code

<TABLE cellSpacing=0 cellPadding=5 width=500 align=center border=0>
<TBODY>
<TR>
<TD align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#888888 size=4 Roman New>first title + </FONT></B></TD>
<TD width=5 bgColor=#30afbf rowSpan=2></TD></TR>
<TR><TD bgColor=#fafafa><DIV align=justify><FONT face=Arial color=#555555 size=1>Praesent nibh eros, vulputate ut, vestibulum eu, lacinia ut, orci. Sed eget dui non pede consectetuer tempus. Phasellus malesuada, metus nec porttitor faucibus, justo metus dapibus eros, id ullamcorper metus sem ut dui. Morbi non nisl sagittis dui blandit pulvinar.</FONT></DIV></TD></TR>
<TR>
<TD></TD></TR>
<TR><TD align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#888888 size=4 Roman New>second title +  </FONT></B></TD>
<TD width=5 bgColor=#a8cc33 rowSpan=2></TD>
<TR><TD bgColor=#fafafa><DIV align=justify><FONT face=Arial color=#555555 size=1>Curabitur nibh erat, dignissim et, hendrerit id, iaculis a, justo. Donec pretium nunc at pede. Nunc tempor, lacus sed auctor interdum, libero quam laoreet dolor, non suscipit ipsum dui a diam. Vivamus venenatis lectus vitae urna.</FONT></DIV></TD></TR>
<TR>
<TD></TD></TR>
<TR>
<TD align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#888888 size=4 Roman New>third title here +  </FONT></B></TD>
<TD width=5 bgColor=#f2bd1d rowSpan=2></TD>
<TR><TD bgColor=#fafafa><DIV align=justify><FONT face=Arial color=#555555 size=1>Liquam nec nisl vel dui tempor molestie. Morbi non odio. Curabitur posuere nulla sit amet felis. Quisque facilisis. Duis eget erat ac lacus facilisis bibendum. Quisque mauris. Sed egestas euismod pede.Aliquam pharetra, massa ut mattis dignissim, velit ipsum ultrices neque, vel iaculis risus mi id est.</FONT></DIV></TD></TR>
<TR>
<TD></TD></TR>
<TR>
<TD align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#888888 size=4 Roman New>fourth title over here +  </FONT></B></TD>
<TD width=5 bgColor=#cc3c18 rowSpan=2></TD>
<TR><TD bgColor=#fafafa><DIV align=justify><FONT face=Arial color=#555555 size=1>Phasellus vulputate congue nunc. Duis tempor. Phasellus quis lacus. Vestibulum diam. Cras nulla nibh, dictum in, suscipit ut, lacinia ut, orci. Nulla semper enim ornare mauris. Ed risus est, tempor ac, placerat sit amet, volutpat eget, diam. Vestibulum ut metus non urna mollis fermentum. </FONT></DIV></TD></TR>
<TR>
<TD></TD></TR>
<TR>
<TD align=right bgColor=#fbfbfb><B><FONT style="LETTER-SPACING: 2px" face="Times New Roman" color=#888888 size=4 Roman New>fifth title which is the last + </FONT></B></TD>
<TD width=5 bgColor=#a1134c rowSpan=2></TD>
<TR><TD bgColor=#fafafa><DIV align=justify><FONT face=Arial color=#555555 size=1>Phasellus hendrerit pellentesque metus. Integer felis mi, molestie in, cursus sed, iaculis nec, nunc. Nulla sit amet tellus. Donec lorem massa, pretium imperdiet, convallis in, aliquam et, sem. Aliquam mauris lorem, adipiscing nec, ultrices a, dignissim eu, dui. Nunc eu sem.</FONT></DIV></TD></TR><TR><TD></TD></TR><TR><TD colSpan=2><HR color=#dddddd></TD></TR><TR><TD colSpan=2><FONT face=Arial color=#555555 size=1>
<CENTER><B>credits</B>: <A href="http://gossymer.livejournal.com/">profile codes</A></CENTER></FONT></TD></TR></TBODY></TABLE>

You can do Edit/Find/Replace all to change all the colors

Heading Background Color code: #fbfbfb
Text Background Color code: #fafafa
Heading Text Color Code: #888888
Regular Text Color Code: #555555

Stripe Color Codes
Box #1: Blue - #30afbf
Box #2: Green - #a8cc33
Box #3: Yellow #f2bd1d
Box #4: Red - #cc3c18
Box #5: Purple - #a1134c

Only rule is to comment & credit - you are free to edit the codes.

★ Feel free to watch noveltybox

NoveltyBox // gossymer

Server Downtime

Minimalist Wikipedia Style

Horizon: Mellow Mint (Userscript)

DreamWidth Layout: Tabula Rasa - Back to Basics

DW site schemes...

Icon guide: Photoshop action, tips & mini tut

Icons: Fullmetal Alchemist: Brotherhood

LJ skinning...

Profile: Desktop Journal

Notice: Two fixes to codes :)

Layout: S2 Bloggish - Showcase

Questions & Answers...

...about noveltybox and me:

...on layouts:

Community Answers

What is noveltybox?

Layout Answers

Profile: Monochrome

Fixing the Entry Title link format

Layout: S2 Bloggish - Desktop

Layout: S2 Bloggish - Stripes

Active Layout Makers

Profiles: Minimalism, Color Stripes v3 &v4

Profile Layout: Color Stripes v2.0

Icon comms

Terminus Badges & HP Icons

Favorite Icon Makers Showcase

Layout: S2 Flexible Squares - Dual

Layout: S2 Bloggish - Celebration

Profile Layout: Color Stripes