Free, copy-paste HTML & CSS code — for everyone

79 generators, editors, templates and reference tools. No sign-up, no build step — fill a form or copy a snippet, and it works on your page immediately.

Browse the tools View on GitHub

79Tools & pages

14Categories

100%Free, no sign-up

library.html Live

// pick any tool, get instant code

Every tool shows a live result Generated code + rendered preview, side by side.

Beta Testing Ready SEO Ready Mobile Responsive Desktop Optimized Fast Loading Reusable Components Shared Header/Footer GitHub Pages Compatible Easy Future Expansion SmartGen Branding Ready

HTML Generators

Fill in a form, get instant, ready-to-paste HTML.

CSS Gradient GeneratorBlend two colours into a smooth linear or radial gradient. Adjust the angle…HTML Bold Text GeneratorType your text, choose whether it needs semantic emphasis or just a visual…HTML Italic Text GeneratorType your text, choose whether it needs semantic stress emphasis or just a…HTML Link GeneratorTurn a URL and label into a complete, safe hyperlink — including the…HTML Marquee GeneratorThe classic scrolling-text effect, generated two ways: the original…HTML Table GeneratorPick your rows, columns and styling below and watch the HTML update in real…HTML Text Style GeneratorStyle a piece of text visually — font, size, colour and weight — and copy…Image Code GeneratorPaste an image URL, set the alt text, size and alignment, and get an…Text Colour GeneratorChoose a colour visually and get the exact span you need to colour any piece…

HTML Editors

Edit or style existing text and markup live in the browser.

HTML Bold EditorA focused, one-job editor: highlight text, click Bold, done. Perfect when…HTML Link EditorHighlight a word, paste in the destination URL, and the selection becomes a…HTML Text EditorHighlight any part of your text and click a toolbar button to wrap it in the…Image Code EditorAlready have an <img> tag? Paste it in, tweak the fields, and this…Live HTML EditorA blank canvas: type or paste any HTML and watch it render instantly on the…Text Colour EditorHighlight text, pick a colour, and the selection is wrapped in the right…

HTML Templates

Starter layouts, CSS templates and page frames to copy.

CSS Component TemplatesSmall, self-contained CSS components you can drop into any project — no…HTML Layout TemplatesCommon page-structure patterns, built with modern CSS Grid and Flexbox. Copy…HTML5 Page FramesThe old <frame>/<frameset> tags were removed from HTML5. These…Website Page TemplatesSmall, complete starting pages for common situations — copy one whole and…

Text Codes

Bold, fonts, colour and underline — the core text tags.

HTML Bold CodeTwo tags make text bold: <strong> for genuinely important text, and…HTML Font CodeSet a font family and size using inline CSS — no external font file needed…HTML Text Colour CodeOne CSS property changes text colour anywhere — copy the pattern below and…HTML Text Formatting CodeThe core inline text tags in one place — copy whichever one your content…HTML Underline CodeTwo ways to underline text: the <u> tag for quick markup, or CSS…

HTML Tables

Borders, colours and text styling for

elements.

HTML Table Background Colour CodeColour an entire table, just one row, or a single cell — the CSS is nearly…HTML Table Border CodeStyle the lines around and inside your table — width, style and colour.HTML Table Text Alignment CodeControl how text sits inside each cell — alignment, padding and weight.HTML Table Text Colour CodeColour the text inside your table cells — apply it broadly or just to the…

Link Codes

Hyperlinks, email links, new-tab links and hover effects.

CSS Hover Effect CodeHover the button below to preview each effect, then copy the CSS.HTML Email Link CodeA mailto link opens the visitor's default email app with the address already…HTML Image Link CodeWrap an image in a link tag to make the whole picture clickable.Open Link in New Window/Tab CodeAdd target="_blank" to open a link in a new tab — paired with rel="noopener…Remove Underline from Link CodeBrowsers underline links by default — one CSS property turns it off.

Image Codes

Image links, borders, tiling and favicon markup.

Background Image Code (Quick Reference)A minimal quick-reference version — for the full interactive tool with…HTML Favicon CodeA favicon is the small icon shown in browser tabs and bookmarks — one line…HTML Image Border CodeFrame an image with a border, and optionally round the corners.Repeating Background Image CodeA small square image, tiled seamlessly into a repeating pattern — great for…

Marquee Codes

Scrolling, sliding and bouncing text or image effects.

Bouncing Image EffectA continuous, playful bounce — often used for mascots, icons or badges.Bouncing Text EffectA playful up-and-down bounce, looping continuously.CSS Marquee (Modern Equivalent)The same scrolling effect as the classic tag, built with standards-compliant…HTML Marquee Tag ReferenceThe <marquee> tag is non-standard and deprecated, but every current…Scrolling Image EffectA continuous strip of images or logos — commonly used for "as featured in"…Scrolling Text EffectContinuous horizontal scroll — adjust the speed and copy the CSS.Slide-In Image EffectAn image enters from the side and settles into place.Slide-In Text EffectText enters from the side and stops in place — a common attention-grabbing…

Background Codes

Background colour, image, position and repeat rules.

HTML Background Colour CodeChoose a colour and copy the CSS to set it as an element's background.HTML Background Image CodeUse any image as a background — paste the URL and copy the CSS.HTML Background Position CodeControl exactly where a background image sits within its element.HTML Background Repeat CodeChoose how a background image repeats — useful for subtle patterns and…HTML Fixed Background CodeScroll the preview below — the background image stays anchored in place, a…

Scrollbox Codes

Scrollable content boxes with custom colour and border.

HTML Scrollbox Border CodeFrame a scrollable box with a custom border — width, style and colour.HTML Scrollbox Colour CodeThe same scrollable box, styled with your own background and text colours.HTML Scrollbox GeneratorFit long content into a fixed-size box with its own scrollbar.

Textbox Codes

Styled text areas with custom colour and border.

HTML Textbox Border CodeFrame a text input with a custom border to match the rest of your form.HTML Textbox Colour CodeGive a text input its own background and text colour to match your site.HTML Textbox GeneratorA simple multi-line text input, sized exactly how you need it.

Color Codes

Pickers, palettes and named hex codes for HTML/CSS.

HTML Black Colour CodeThe standard black colour in every format your CSS might need, plus a few…HTML Blue Colour CodeThe standard blue colour in every format your CSS might need, plus a few…HTML Colour Code ChartEvery common named colour with its hex code, in one searchable table. Type…HTML Colour PickerPick a colour with the swatch below and copy it in whichever format your CSS…HTML Colour SchemesCoordinated 5-colour palettes, from a deep background shade through to a…HTML Green Colour CodeThe standard green colour in every format your CSS might need, plus a few…HTML Red Colour CodeThe standard red colour in every format your CSS might need, plus a few…HTML White Colour CodeThe standard white colour in every format your CSS might need, plus a few…

Character Codes

Copy-paste HTML entities: symbols, punctuation, Greek.

HTML Ampersand Symbol CodeThree ways to write this character in HTML — pick whichever your project…HTML Copyright Symbol CodeThree ways to write this character in HTML — pick whichever your project…HTML Em Dash CodeThree ways to write this character in HTML — pick whichever your project…HTML En Dash CodeThree ways to write this character in HTML — pick whichever your project…HTML Euro Symbol CodeThree ways to write this character in HTML — pick whichever your project…HTML Heart Symbol CodeThree ways to write this character in HTML — pick whichever your project…HTML Non-Breaking Space CodeThree ways to write this character in HTML — pick whichever your project…HTML Star Symbol CodeThree ways to write this character in HTML — pick whichever your project…HTML Tab Space CodeThree ways to write this character in HTML — pick whichever your project…HTML Trademark Symbol CodeThree ways to write this character in HTML — pick whichever your project…

Reference

Full character sets, symbol tables and language codes.

HTML Greek Characters TableThe full Greek alphabet, both cases, with HTML entity codes — commonly used…HTML Special Characters TableSearch or scroll to find any common special character, then copy its entity…HTML Symbols TableDecorative and functional symbols in one searchable table.ISO Language Codes TableTwo-letter language codes for the HTML lang attribute — e.g. <html…ISO-8859-1 (Latin-1) Characters TableAccented Latin letters used across French, Spanish, German, Portuguese and…