Page: 1 2 3 4 5 6 7
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
Blue Table Cloth (inspired by a CSS pen by Mirandi)
CSS BACKGROUND CODE
body {
height: 100%;
background: repeating-linear-gradient(-45deg, transparent, transparent 1em, #7fd7f566 0, #7fd7f51a 2em, transparent 0, transparent 1em, #7fd7f54d 0, #7fd7f533 4em, transparent 0, transparent 1em, #c0ebfa99 0, #c0ebfa33 2em), repeating-linear-gradient(45deg, transparent, transparent 1em, #7fd7f566 0, #7fd7f51a 2em, transparent 0, transparent 1em, #7fd7f54d 0, #7fd7f533 4em, transparent 0, transparent 1em, #c0ebfa66 0, #c0ebfa1a 2em), #FFFFFF;
background-blend-mode: multiply;
}
|
|
4/29/2019, 6:52 pm
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
Stained Glass Motif
CSS BACKGROUND CODE
body {
background: radial-gradient(2em, rgba(255, 255, 255, 0) 80%, #778691 80%, #7786ff 99%, rgba(255, 255, 255, 0)) 0 0, radial-gradient(4em, rgba(255, 255, 255, 0) 80%, #708691 80%, #708691 99%, rgba(255, 255, 255, 0)) 4em 4em, radial-gradient(4.75em, rgba(255, 255, 255, 0) 50%, #ffcfc4 50%, #17C2B3 75%, #11C2B3 99%, rgba(255, 255, 255, 0)) 4em 4em, radial-gradient(4.7em, rgba(255, 255, 255, 0) 50%, #0eC9B7 50%, #0eFC10 75%, #0eC0ff 99%, rgba(255, 255, 255, 0)) 0 0;
background-size: 8em 8em;
background-color: #ddcfdf;
}
Remember, I test all of these CSS background creations on my Folder Mania testing message board.
|
|
4/30/2019, 1:39 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Joxcenia
Global Administrator
Runboard staff member
Registered: 11-2005
Location: Whoosher House
Posts: 3495
Karma: 56 (+57/-1)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
They're beautiful.
|
|
4/30/2019, 3:29 am
|
Link to post
Email Joxcenia
PM Joxcenia
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
Blueberry Juice (this is the background I created for the Blueberry Fun Runboard skin)
/* CSS BACKGROUND */
body {
background: #54F9F8;
background: #092756;
background: -moz-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%),-moz-linear-gradient(top, rgba(57,173,219,.25) 0%, rgba(42,60,87,.4) 100%), -moz-linear-gradient(-45deg, #670d10 0%, #6791d4 50%, #092756 100%);
background: -webkit-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), -webkit-linear-gradient(top, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), -webkit-linear-gradient(-45deg, #670d10 0%, #6791d4 50%, #092756 100%);
background: -o-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), -o-linear-gradient(top, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), -o-linear-gradient(-45deg, #670d10 0%, #6791d4 50%, #092756 100%);
background: -ms-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), -ms-linear-gradient(top, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), -ms-linear-gradient(-45deg, #670d10 0%, #6791d4 50%, #092756 100%);
background: -webkit-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), linear-gradient(to bottom, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), linear-gradient(135deg, #670d10 0%, #6791d4 50%, #092756 100%);
}
|
|
4/30/2019, 8:50 pm
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
Zucinni Bands is the background I created for the Green on Dark Runboard theme update. The name comes from the name of the blended colors used in the creation of the background.
/* CSS BACKGROUND */
body {
background: linear-gradient(27deg, #042900 5px, transparent 5px) 0 5px, linear-gradient(207deg, #011f06 5px, transparent 5px) 10px 0px, linear-gradient(27deg, #032300 5px, transparent 5px) 0px 10px, linear-gradient(207deg, #022900 5px, transparent 5px) 10px 5px, linear-gradient(90deg, #142513 10px, transparent 10px), linear-gradient(#032100 25%, #013503 25%, #032700 50%, transparent 50%, transparent 75%, #022b09 75%, #002b0e);
background-color: #222222;
background-size: 25px 12.5px;
}
|
|
5/5/2019, 7:11 pm
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
Aum Jersey - The resulting image is with a white (#FFFFFF) body background, but you can change the shade of the picture by using different hex colors.
/* CSS BACKGROUND */
body {
background: #FFFFFF;
background-image: repeating-linear-gradient(144deg, #0019e6bf, #19b96ebf 1px, transparent 0, transparent 2px);
background-size: 12px;
}
Last edited by Pastor Rick, 5/28/2019, 12:19 am
|
|
5/15/2019, 7:30 pm
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
My CSS code for the Lozenge art-deco background looks like this (so far):
/* DECO LOZENGE BACKGROUND */
HTML {
height: 100%;
}
BODY {
background: linear-gradient(to right top, #f689 15%, #fff0 15%) 2em 4em, linear-gradient(to left top, #f68c 15%, #fff0 15%) 2em 4em, linear-gradient(to left bottom, #f689 15%, #fff0 15%) 2em 4em, linear-gradient(to right bottom, #f68c 15%, #fff0 15%) 2em 4em, linear-gradient(to right top, #77ddff80 15%, #fff0 15%) 0 0, linear-gradient(to left top, #7dfc 15%, #fff0 15%) 0 0, linear-gradient(to right bottom, #7dfc 15%, #fff0 15%) 0 0, linear-gradient(to left bottom, #77ddff80 15%, #fff0 15%) 0 0, linear-gradient(to right top, #be9c 25%, #fff0 25%) 0 0, linear-gradient(to left top, #bbee9980 25%, #fff0 25%) 0 0, linear-gradient(to right bottom, #bbee9980 25%, #fff0 25%) 0 0, linear-gradient(to left bottom, #be9c 25%, #fff0 25%) 0 0;
background-size: 4em 8em;
background-color: #33f;
font: 1.5em/1 'Trebuchet MS', Verdana, sans-serif;
}
Last edited by Pastor Rick, 5/28/2019, 5:50 am
|
|
5/27/2019, 6:17 pm
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
I started playing with the numbers and color-tints of the lozenge code, and the results are an overlapping lozenge and diamond (art-deco) design.
BODY {
background: linear-gradient(to right top, #f689 15%, #fff0 15%) 2em 4em, linear-gradient(to left top, #f68c 15%, #fff0 15%) 2em 4em, linear-gradient(to left bottom, #f689 15%, #fff0 15%) 2em 4em, linear-gradient(to right bottom, #f68c 15%, #fff0 15%) 2em 4em, linear-gradient(to right top, #77ddff80 15%, #fff0 15%) 0 0, linear-gradient(to left top, #7dfc 15%, #8c202000 15%) 0 0, linear-gradient(to right bottom, #7dfc 15%, #fff0 15%) 0 0, linear-gradient(to left bottom, #77ddff80 15%, #fff0 15%) 0 0, linear-gradient(to right top, #be9c 25%, #fff0 25%) 0 0, linear-gradient(to left top, #bbee9980 25%, #fff0 25%) 0 0, linear-gradient(to right bottom, #bbee9980 25%, #fff0 25%) 0 0, linear-gradient(to left bottom, #be9c 25%, #fff0 25%) 0 0;
background-size: 4em 4em;
background-color: #3355aa;
font: 1em/1 Verdana, sans-serif;
}
|
|
5/28/2019, 10:38 pm
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Joxcenia
Global Administrator
Runboard staff member
Registered: 11-2005
Location: Whoosher House
Posts: 3495
Karma: 56 (+57/-1)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
They're all really cool.
|
|
5/29/2019, 5:15 am
|
Link to post
Email Joxcenia
PM Joxcenia
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10247
Karma: 272 (+331/-59)
|
|
Reply | Quote
|
|
Re: The "Spouzic-art" Revival (CSS only backgrounds)
From Lesigner Girl comes this "Blacklight Bamboo" CSS background.
CSS Background
body {
background-color: #000;
background-image: linear-gradient(#00ff0012 1%, #0000 99%), linear-gradient( 90deg, #00ff0021 20%, #ff000021 40%, #00000021 80%, #00000021 100%), linear-gradient( 90deg, #64000033 30%, #ffffff30 80%, #64000033 100%), linear-gradient( #0000002b 2%, #ff00002e 12%, #ff00002e 30%, #00ff002e 65%, #0000002e 85%), linear-gradient( 45deg, #ffffff2b 5%, #0000001a 25%, #f003 30%, #f003 40%, #0003 60%, #0003 70%, #fff3 80%), linear-gradient( -45deg, #ffffff2b 2%, #0000001a 30%, #f003 45%, #f003 55%, #0003 65%, #0003 80%, #fff3 95%);
background-size: 15px, 25px, 35px, 45px, 100px, 85px;
}
|
|
6/6/2019, 1:10 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Add a reply
Page: 1 2 3 4 5 6 7
You are not logged in ( login)
|
