266074 users& counting
Privacy policy

FancyTables: Several styles and colors, including PSD, CSS and Bootstrap versions.

20
Comment Here
Share some love with a comment

Creating HTML tables can be a little intimidating for us, they are kind of tricky, and sometimes we don’t get a good result in our table.

Given that, most of the times we end up making them using UL and LI tags because they are more intuitive to style, however we’ve discover that the TABLE tag is a very powerful tag which gives you a lot of flexibility and should be used more every time we can.

With all the experiences we’ve had implementing tables, we decided that it was a good idea to create a library that helped us creating them faster so we created a collection of CSS class which don’t use any image to style the tables, in order to enhance our tables, so that we just have to create the table markup and by adding the classes on the CSS file the it will look pretty cool.

In today’s post we’re sharing this CSS table styles called FancyTables so that you can download and use them, in your projects.
There are two version, one that works as an extensions of bootstrap and another that works standalone.

We’re eager to get feedback on this styles, and if there is something that you’d like to add to them we’ll be glad to hear from you about it.

In this sample video, you can take a look at how FancyTables Works and how to use it.

fancy tables HTML

fancy tables set

fancy tables pack

fancy tables PSD

fancy tables Photoshop

fancy tables template

fancy tables Sources

fancy tables resource

fancy tables free

fancy tables design

fancy tables CSS

fancy tables HTML

fancy tables WordPress

fancy tables HTML + CSS

fancy tables PSD

fancy tables Photoshop

fancy tables template

fancy tables free

fancy tables CSS

Basic usage

1. Reference the css file ‘table-party.css’ in your html or php file.


2. Create the table markup, add the class ‘table’ and the class that gives your table the custom look: e.g table-black.

</pre>
<table class="table fancy-table">
<thead>
<tr>
<th>...</th>
<th>...</th>
</tr>
</thead>
<tbody>
<tr>
<td>...</td>
<td>...</td>
</tr>
</tbody>
</table>
<pre>
<!-- Available Styles table-black table-fancy table-chronos table-water table-wine table-red table-green table-brown table-blue   -->

3. Enjoy it.

Read Carefully, Specially: Hotmail / MSN / OutLook users, please check your spam/junk folder to get our msgs and mark us as safe senders (see how) to be sure you can get all our freebies. Our email is: freebies@designshock.com
Only PSD version
Buy all versions, CSS, Bootstrap and PSD with commercial license and full source files
Get this set bundled with tons of resources (icons, themes, design sets, vectors and much more)

Some other freebies:

Amazing free bundle: 10 WordPress themes, 750 quality icons and more
204 Google Plus interface icons, including several sizes. (pixel perfect)
Freebie: Popular applications icon set, (high quality finishing)
Full Windows 8 GUI Theme pack (metro style, with editable source files)
The most impressive Button Pack Ever: 2000 buttons, 100 design styles, 5 color variations
300 seamless patterns, including metal, pixel, fabric wood and more.
More than 50 Full Folder and Brochure Templates with sources files in PSD
Invoice Templates and business templates, 15 free with sources in PSD, Ai and InDesign
Pricing tables and business icons: 50 designs, 20 colors,112 icons, with PSD sources
Shock Handwritten Font: A beautiful, and exclusive free font you can download now
iOS7 GUI: Fantastic set with more than a thousand elements
Free Flat Characters: More Than 3000 flat vector characters with over 200 accessories
  1. nice one … love it :)

  2. karthickkumar - July 13, 2012

    Bootstrap is the trending framework for web designers. Pricing tables on bootstrap is a cool one. Thanks

    • DesignShock - July 18, 2012

      yes, we are using and recommending it a lot!, it’s a great framework. actually all our themes are bootstrap ready.

  3. All table designs are great. These FancyTables are very useful. Thanks for sharing. 

  4. Wow, these do look great! What is comparability like for IE6 – IE8?

  5. Andy - July 13, 2012

    hi juan Pablo

    one major feature your could add is

    this example http://quanticalabs.com/script/css3-web-pricing-tables-pack-grids-/234948

    on mouse hover pop up with shadow or glow also a border

    this would be very helpful

    regards
    Andy

  6. Nice!! I have a reseller hosting account that I still have not made a website for. One of the things holding me back was pricing tables. Thanks!

    • DesignShock - July 18, 2012

      Su, that’s great, hope these tables can help you complete that specific project dude.

  7. hi, nice work~ love it so much.
    well, I have sent the email,  but still  can’t download the file. when my mouse hover the button, it can’t click it. please help.

Leave a Reply

*

DesignShock Bundle This bundle includes:
  • Absolutely all sets from designshock, including all parts, colors and styles per set.
  • Unlimited Commercial license of all sets: so you can use on unlimited customers.
  • Updates for 1 year, enjoy the new sets for a whole year. (1 each week)
  • Source files included, so that you can do your own editions.
Check out all the elements:
Buy Full DesignShock (bundle) $29