No images, 100% CSS pretty heading, with page curly thingy
Lots going on here.
- Subtle left-to right gradient from dark blue - to lighter blue
- Text shadow
- Box shadow
- CSS triangle
- 2 levels of CSS gradients
- Slight border changes
- rounded corners
- etc...
- Subtle left-to right gradient from dark blue - to lighter blue
- Text shadow
- Box shadow
- CSS triangle
- 2 levels of CSS gradients
- Slight border changes
- rounded corners
- etc...
10 March 2010
Share page link
Copy
Link to the page you are
looking at right now :)
looking at right now :)
Privacy
Pssst!.. This page is Secret - it can only be seen if you give people the link
Looks great!
nice
Nice heading. I think it is debatable whether pure CSS or using images is a better choice. I prefer images myself, but I'm sure that will change soon. Keep up the good work!
Just CSS???? Cool man..
@Chris - Yeah, you might be right. This was more of a "see if I can do it" type of boredom.
Nicely done! I don't have the patience to do something like this myself...so I admire those of you who take the time.
Wow! That is amazing!
The hardest part is getting the three layers of color on the borders. You'll see that it goes from lighter blue, to almost black, to a grayish color. That was the hardest part. I ended up having to use a mix of borders and a 1px CSS gradient.
Really nice. Great things come out of boredom
.
Nice work! It looks like boredom is creating more cool stuff.
nice!
where is the css header? ican only see a .jpg file
@awad - It's just an image. I'll post the code later this week on Nettuts.
Jeffrey This is really nice. You are becoming css3 mad-man.
impressive man looking forward to seeing this tut, I'm going through a minimalist phase at the moment and trying to do everything via CSS2 and CSS3.
wow really nice
Nice !
Can we view the live demo?....
Well done, this looks amazing!
Did you get inspired by this ?
http://blog.metalabdesign.com/post/437932602/metalab-goes-open-source
@Yogal - Yep. Not ripping it at all.
Saw it, and tried to figure out if I could do it without images. Don't worry - won't be posted anywhere. 
I've been using CSS3 for a few months now, but couldn't figure out the double color border. Thanks for the gradient tip; I'm looking forward to the tut.
Wow, that looks great!. What do we have on browser compatibility?
Hope this works in at least Firefox and Chrome...
That's great. I'm looking forward to the tut.
@jeffreyway - I wouldn't suspect you of ripping off anything, I was just curious, maybe I used the wrong link
Anyway, keep up the good work!
REALLY looking forward to this too - its the one thing i see alot and cannot figure out lol
Awesome! Can't wait to see it live!
I'm in eager anticipation of a tutorial!
<div style="border, radius, and box-shadow">
<div style="border, radius, and text padding/style">
<h1>Header</h1>
</div>
<div style="css shapeyfied, position rel top=100% (???)"> </div>
</div>