How to use
- Open the Table tab to build a table, or the Box Shadow tab for a shadow.
- For a table, set the number of rows and columns, the table width and the border thickness. For a shadow, move the offset, blur and spread sliders.
- Check the preview, then use the copy icon above the code block.
The Table tab creates an HTML table with a header row and the number of body rows and columns you set. Header cells are filled with text like Header 1 and body cells with text like Cell 1-1, which you replace with your own content. The width field accepts any CSS width value, with 100% as the default, and the border field sets the border thickness in pixels. The copied code starts with a style block for a class named gen-table that sets collapsed borders, cell padding, a shaded header, striped even rows and a hover color, followed by the table markup.
The Box Shadow tab outputs a single box-shadow declaration. You control the horizontal offset and vertical offset (-50 to 50 px), the blur radius (0 to 100 px), the spread (-50 to 50 px), the shadow color as a CSS color value and an inset option for an inner shadow. The default color is a light transparent black. The preview box updates as you move the sliders.
Both tabs show the code in a block with a copy button. Row and column counts must be at least 1, and the border value at least 0.
The code is generated in your browser and nothing is uploaded.
FAQ
Does the table come with styling?
Yes. The output includes a style block for the class gen-table, with borders, padding, a shaded header, striped rows and a hover color. You can edit or remove it.
Can I merge cells or add captions?
No. The generator makes a plain grid with one header row. Edit the copied markup if you need more.
What does the spread value do in a shadow?
It grows or shrinks the shadow before blurring. Positive values make it larger and negative values make it smaller.
Can I make an inner shadow?
Yes. Tick the inset option and the output ends with the inset keyword.
Is my input sent anywhere?
No. The code is built in your browser.