Lightesy got their homepage at Neopets.com

Welcome to Extended Imagination! Here you'll find the perfect premade layout, along with resources. We are located in a magical kingdom in the sky, north of Faerieland. The faeries have given us the job of extending your imagination. All of the teachers of imagination live in a workshop, in a secret location. They've worked there since queen Fyora sent them there, 10 years ago. They're waiting for you, so jump in a hot air balloon and hang on for the ride!

The Imagination Poll

Please neomail Autobot to submit your answer!

What is your favorite color neopet?
1. Rainbow
2. Chocolate
3. Plushie
4. Baby

Thank you for answering our poll, this helps us make the premades and resources better.

Navigate The Workshop

The Protocol Premade Workspaces Resources Sitely
Premade Workspaces Navigation Toy Box Artfully Simple The Mirror On The Wall

When you reach our castle, please follow the rules. We wouldn't want to tell the queen, now would we?

1. Please leave the credit, I work hard on each addition.
2. Don't give people our premades saying you made them.
3. I'm not taking requests right now, I might later.
4. Please don't ask me to teach you how to code, I'm not that good. :)
5. Please, no hate mail.

Workshop Notes

These are notes about our content, and things that you can do with them.
You may edit your premade layouts.
Credit is not mandatory for some of the resources.
Suggestions for new layouts are appreciated, 80% of the time I'll use them. :)
All of our colors are based on an item/color. Like the Toy Shop is based on toys.
Drag and drop the preview to the address bar, it will be enlarged.

These are our premade petpage layouts for your use. Please keep the credit, it's only fair. The colored dots after the name are the colors of the layouts.

The Toy Shop

The teachers of imagination need tools to work with, so they use toys. These are also a favorite of the queen's.

Preview

Styles

Robo Aisha
• • •

<div id="content" style="position: absolute;">
<h1>Header Here</h1>
<div class="table">
Thanks for using one of the <a href="/~Fliersia">Extended Imagination</a> premades.  You are using the style <b>Toy Factory</b>, one of my favorites!  Edit this premade however you wish, just leave the credit. 
</div>
<h1>More Headers</h1>
<div class="table">
A bunch of content goes here. <br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
</div>
<h1>Credits</h1>
<div class="table">
Layout made by <a href="/~Lightesy">Extended Imagination</a>
<p>

<font class="a">Skating Bruce Toy</font> <br><font color="#F08080" size="4">•</font> <font color="#C71585" size="4">•</font> <font color="ADD8E6" size="4">•</font> <br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: justify;}
b {color: #F08080; font-weight: bold;}
i {color: #000; font-style: italic;}
u {color: #C71585; text-decoration: underline;}
a:link, a:visited, a:active {color: #000; text-decoration:none; font-weight: bold;}
a:hover {color: #F08080;}

h1 {font: 18px Century Gothic; background-color: #C71585; 
text-align: center; padding: 2px; color: #FFF; margin: 0px;}

#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: none;}
.table {width: auto; height: auto;
font: 10px Verdana; color: #000;
background-color: #FFF; text-align: left;
padding: 2px; margin: 0px; margin-bottom: 25px;
border: 1px solid #C71585; border-top: 0px solid #000;}
/>

<h1>Header Here</h1>
<div class="table">
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  Your are using the style <b>Toy Factory</b>, one of my favorites!  Edit this premade however you wish, just leave the credit. 
</div>
<h1>More Headers</h1>
<div class="table">
A bunch of content goes here.
<b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
</div>
<h1>Credits</h1>
<div class="table">
Layout made by <a href="/Fliersia">Extended Imagination</a>.
<p>

<font class="a">Jhuidah Snowglobe</font> <br><font color="#48D1CC" size="4">•</font> <font color="#F08080" size="4">•</font> <font color="90EE90" size="4">•</font> 
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: justify;}
b {color: #48D1CC; font-weight: bold;}
i {color: #000; font-style: italic;}
u {color: #F08080; text-decoration: underline;}
a:link, a:visited, a:active {color: #000; text-decoration:none; font-weight: bold;}
a:hover {color: #48D1CC;}

h1 {font: 18px Century Gothic; background-color: #F08080; 
text-align: center; padding: 2px; color: #FFF; margin: 0px;}

#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: none;}
.table {width: auto; height: auto;
font: 10px Verdana; color: #000;
background-color: #FFF; text-align: left;
padding: 2px; margin: 0px; margin-bottom: 25px;
border: 1px solid #F08080; border-top: 0px solid #000;}
/>

<h1>Header Here</h1>
<div class="table">
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  Your are using the style <b>Toy Factory</b>, one of my favorites!  Edit this premade however you wish, just leave the credit. 
</div>
<h1>More Headers</h1>
<div class="table">
A bunch of content goes here.<br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
</div>
<h1>Credits</h1>
<div class="table">
Layout made by <a href="/~Lightesy">Extended Imagination</a>.
<p>

<font class="a">Angle Chia Plushie</font> <br><font color="#F0E68C" size="4">•</font> <font color="#FFB6C1" size="4">•</font> <font color="ADD8E6" size="4">•</font> 
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: justify;}
b {color: #F0E68C; font-weight: bold;}
i {color: #FFB6C1; font-style: italic;}
u {color: #000; text-decoration: underline;}
a:link, a:visited, a:active {color: #000; text-decoration:none; font-weight: bold;}
a:hover {color: #F0E68C;}

h1 {font: 18px Century Gothic; background-color: #FFB6C1; 
text-align: center; padding: 2px; color: #FFF; margin: 0px;}

#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: none;}
.table {width: auto; height: auto;
font: 10px Verdana; color: #000;
background-color: #FFF; text-align: left;
padding: 2px; margin: 0px; margin-bottom: 25px;
border: 1px solid #FFB6C1; border-top: 0px solid #000;}
/>

<h1>Header Here</h1>
<div class="table">
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  Your are using the style <b>Toy Factory</b>, one of my favorites!  Edit this premade however you wish, just leave the credit.  You can read the story below, but it's mostly so you can see what this will look like with real text on it. :)
</div>
<h1>More Headers</h1>
<div class="table">
A bunch of content goes here.<br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
</div>
<h1>Credits</h1>
<div class="table">
Layout made by <a href="/~Lightesy">Extended Imagination</a>.
</div>
</div>

Artfully Simple

The teachers of imagination must cover the basics first. They use these simple paint brushes to create master pieces.

Preview

Styles

Maraquen Paint Brush
• • •

<div id="content" style="position: absolute;">
<h1 style="margin-top: 0px;">Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>Artfully Simple</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
Text here, etc. <br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>.
<p>

<font class="a">Pirate Paint Brush</font> <br><font color="#FFD700" size="4">•</font> <font color="#CD5C5C" size="4">•</font> <font color="D3D3D3" size="4">•</font> 
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: left;}
b {color: #FFD700; font-weight: bold;}
i {color: #CD5C5C; font-style: italic;}
u {color: #FFD700; text-decoration: underline;}
a:link, a:visited, a:active {color: #CD5C5C; text-decoration:none;}
a:hover {color: #000;}

h1 {font: 17px Century Gothic; background-color: #CD5C5C; 
text-align: center; padding: 2px; color: #FFF; margin-top: 1px; border: 1px solid #000; font-weight: bold;}

#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: #FFF; padding-left: 3px; padding-right: 3px;}
/>

<h1 style="margin-top: 0px;">Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>Artfully Simple</b>!  Edit this premade however you wish, just leave the credit.<p>
</p>
<h1>Header</h1>
 Text here, etc.<br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>. <p>

<font class="a">Snow Paint Brush</font> <br><font color="#FF4500" size="4">•</font> <font color="#87CEFA" size="4">•</font> <font color="E0FFFF" size="4">•</font> 
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: left;}
b {color: #FF4500; font-weight: bold;}
i {color: #87CEFA; font-style: italic;}
u {color: #FF4500; text-decoration: underline;}
a:link, a:visited, a:active {color: #87CEFA; text-decoration:none;}
a:hover {color: #000;}

h1 {font: 17px Century Gothic; background-color: #87CEFA; 
text-align: center; padding: 2px; color: #FFF; margin-top: 1px; border: 1px solid #000; font-weight: bold;}

#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: #FFF; padding-left: 3px; padding-right: 3px;}
/>

<h1 style="margin-top: 0px;">Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>Artfully Simple</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
 Text here, etc.<br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>. <p>

<font class="a">Usuki Paint Brush</font> <br><font color="#800080" size="4">•</font> <font color="#FF1493" size="4">•</font> <font color="FFB6C1" size="4">•</font> 
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: left;}
b {color: #800080; font-weight: bold;}
i {color: #FF1493; font-style: italic;}
u {color: #800080; text-decoration: underline;}
a:link, a:visited, a:active {color: #FF1493; text-decoration:none;}
a:hover {color: #000;}

h1 {font: 17px Century Gothic; background-color: #FF1493; 
text-align: center; padding: 2px; color: #FFF; margin-top: 1px; border: 1px solid #000; font-weight: bold;}

#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: #FFF; padding-left: 3px; padding-right: 3px;}
/>

<h1 style="margin-top: 0px;">Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>Artfully Simple</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
 Text here, etc.<br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>.
<p>
<font class="a">Strawberry Fleids Forever Paint Brush</font> <br><font color="#DC143C" size="4">•</font> <font color="#008000" size="4">•</font> <font color="DEB887" size="4">•</font> 
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: left;}
b {color: #DC143C; font-weight: bold;}
i {color: #008000; font-style: italic;}
u {color: #DC143C; text-decoration: underline;}
a:link, a:visited, a:active {color: #008000; text-decoration:none;}
a:hover {color: #000;}
h1 {font: 17px Century Gothic; background-color: #008000; 
text-align: center; padding: 2px; color: #FFF; margin-top: 1px; border: 1px solid #000; font-weight: bold;}
#content {width: 800px; height: auto; top: 25px; 
left: 100px; border: 0px solid #000; 
background-color: #FFF; padding-left: 3px; padding-right: 3px;}
/>

<div id="content" style="position: absolute;">
<h1 style="margin-top: 0px;">Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>Artfully Simple</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
Text here, etc. <br><b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>.
</div>

The Mirror On The Wall

The first thing you do at the workshop is make a mirror to hang on the wall of your new room. Odd, but true.

Preview

Styles

Meowclops Mirror
• • •

<div id="content" style="position: absolute;">
<h1>Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>The Mirror On The Wall</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
<b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>. <p>

<font class="a">Darigan  Mirror</font> <br><font color="#800080" size="4">•</font> <font color="#DDA0DD" size="4">•</font> <font color="DCDCDC" size="4">•</font>
<br><textarea><style></style>
body, tr, td, table {font: 10px Georgia; color: #000; text-align: left;}
b {color: #800080; font-weight: bold;}
i {color: #DDA0DD; font-style: italic;}
u {color: #000; text-decoration: underline;}
a:link, a:visited, a:active {color: #DDA0DD; text-decoration:none; font-weight: bold;}
a:hover {color: #000;}
h1 {font: 16px Century Gothic; background-color: #FFF; 
text-align: left; padding: 2px; color: #800080; margin-top: 1px; border-left: 15px solid #DDA0DD; letter-spacing: 1px;}
#content {width: 800px; height: 500px; overflow: auto; top: 25px; 
left: 100px; border: 1px solid #000; 
background-color: #FFF; padding-left: 4px; padding-right: 5px;}
/>

<div id="content" style="position: absolute;">
<h1>Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>The Mirror On The Wall</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
<b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>.<p>

<font class="a">Anubis Mirror</font> <br><font color="#FFD700" size="4">•</font> <font color="#000080" size="4">•</font> <font color="ADD8E6" size="4">•</font>
<br><textarea><style></style>
body, tr, td, table {font: 10px Georgia; color: #000; text-align: left;}
b {color: #FFD700; font-weight: bold;}
i {color: #000080; font-style: italic;}
u {color: #000; text-decoration: underline;}
a:link, a:visited, a:active {color: #000080; text-decoration:none; font-weight: bold;}
a:hover {color: #000;}
h1 {font: 16px Century Gothic; background-color: #FFF; 
text-align: left; padding: 2px; color: #000080; margin-top: 1px; border-left: 15px solid #FFD700; letter-spacing: 1px;}
#content {width: 800px; height: 500px; overflow: auto; top: 25px; 
left: 100px; border: 1px solid #000; 
background-color: #FFF; padding-left: 4px; padding-right: 5px;}
/>

<div id="content" style="position: absolute;">
<h1>Header Here</h1>
Thanks for using one of the <a href="/~Lightesy">Extended Imagination</a> premades.  You are using the style <b>The Mirror On The Wall</b>!  Edit this premade however you wish, just leave the credit. <p>
</p>
<h1>Header</h1>
<b>bold</b> <i>italic</i> underline <a href="/~Fliersia">Linkage</a><p>
Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p> Content </p>
<p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>.
</div>

Pencils!

The imagination has to be recorded with something, why not Pencils!? You can draw, doodle, and sketch your way to fame and fortune!

Preview

Coming soon...

Styles

Basic Pencil
• • •

<div id="content" style="position: absolute;">
<h1>Header</h1>
Thanks for using one of our premades.  Don't forget that you can edit, but you must keep the link to us at the bottom. <p>
</p>
<h1>Endless Headers</h1>
Just more text goes here... <br><b>bold</b> <i>italic</i> underline <a href="/~Lightesy">Linkage</a> <p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>. </div>
<div id="side" style="position: absolute;">
<h1>Just Another Header</h1> 
And lost of sitely stuff goes here!  And, of course, text! <p>

</p>
<p>

<font class="a">Pencil Of The Earth Faerie</font> <br><font color="#9ACD32" size="4">•</font> <font color="#6B8E23" size="4">•</font> <font color="#A0522D" size="4">•</font>
<br><textarea><style></style>
body, tr, td, table {font: 10px Verdana; color: #000; text-align: left;}
b {color: #9ACD32; font-weight: bold;}
i {color: #6B8E23; font-style: italic;}
u {color: #A0522D; text-decoration: underline;}
a:link, a:visited, a:active {color: #008000; text-decoration:none;}
a:hover {color: #000; letter-spacing: 1px;}
h1 {font: 15px Verdana; background-color: #008000; 
text-align: center; padding: 2px; color: #FFF; border-bottom: 5px solid #9ACD32; letter-spacing: 1px; padding-bottom: 1px;}
#content {width: 600px; height: auto; top: 25px; 
left: 30px; border: 0px solid #000; 
background-color: #FFF; padding: 3px;}
#side {width: 300px; height: auto; top: 25px; 
left: 650px; border: 1px solid #000; 
background-color: #FFF; padding: 3px;}
/>

<div id="content" style="position: absolute;">
<h1>Header</h1>
Thanks for using one of our premades.  Don't forget that you can edit, but you must keep the link to us at the bottom. <p>
</p>
<h1>Endless Headers</h1>
Just more text goes here... <br><b>bold</b> <i>italic</i> underline <a href="/~Lightesy">Linkage</a> <p>
</p>
<h1>Credits</h1>
Layout made by <a href="/~Lightesy">Extended Imagination</a>. </div>
<div id="side" style="position: absolute;">
<h1>Just Another Header</h1> 
And lost of sitely stuff goes here!  And, of course, text! <p>
</p>
<p>
</p>
</div>

These resources are here to help you build your site, while expanding your imagination.

Site Names

Credit for these is not mandatory, but it is appreciated.

34 Names

Alpha
Avalanche
Beyond
Bravo
Busted Buttons
Crayon
Dear Melody
Dusty Photos
Everlasting
Glamor
Graceful Reviews
Inspire
Joyful
Lover Of Buttons
Oil Paint
Phonetic Letters
Pinktastic
Premade Wonders
Rippling
Snow Designs
Snowcapped
Solar
Space Rush
Spin The Button
Starlit
Sunny Days
Sweetie
The Factory
Traced
Twinkle
Vintage
Venture
Whitewashed

Coding Cheat Sheet

There is no need to credit for any of these. More are being added all the time.

Open Link In New Window

target="blank

Premade Link To Your Site

www.neopets.com/~Insert_Pet_Name_Here

Change Background Color In Petpages

This is where you can find all of the sitely items. This is what makes this site work, help from it's buddies!

Today's Work and Workshop Rejects

Oh, a cute little rejected toy from the workshop. Why not take one home?
Today was active enough, we'll let you in on the secrets.

Today's Work

December 26th

User lookups are going to be added, a new layout for us, and a complete revamp before we open on New Year's Eve.

Workshop Rejects

Neighboring Workshops and Imaginative Listings

Neomail me if you want to be a Neighboring Workshop, I'm taking only high quality premade, graphic, or tutorial sites only please. If you list me neomail me and I'll link back.

Neighboring Workshops

None.

Imaginative Listings

None.

Imagination Inspections and My Other Workshop

At the current time, I have another workshop you might want to visit. Some people with strong imaginations have given us their opinions on the shape of our workshop.

Imagination Inspections

None.

My Other Workshop

A comfortable review site, but it is currently on hiatus.

Workshop Plaque

Credits

Layouts, banner, content, and resources made by fall_faerie. All images are from neopets, edited by me.
//Version 1.0// Dream Of Flying
We started on the 13th of December, 2009.

The Passersby

Counter started on December 14th, 2009.

Into the Balloon

The Imagination Poll

Navigate The Workshop

The Protocol

Workshop Notes

Premade Workspaces

The Toy Shop

Preview

Styles

Artfully Simple

Preview

Styles

The Mirror On The Wall

Preview

Styles

Pencils!

Preview

Styles

Resources

Site Names

Coding Cheat Sheet

The Imagination Works

Today's Work and Workshop Rejects

Today's Work

Workshop Rejects

Neighboring Workshops and Imaginative Listings

Neighboring Workshops

Imaginative Listings

Imagination Inspections and My Other Workshop

Imagination Inspections

My Other Workshop

Workshop Plaque

Credits

The Passersby