# Tileio

> A library of 727 design layers for websites (templates, sections, pages, elements, SVG vectors, three.js scenes, animated backgrounds and WebGL gradients). Each layer is tuned in the browser and copied as a prompt for an AI coding tool such as Claude, Cursor or ChatGPT, for single HTML, Next.js, React, Vue, Astro, WordPress, Shopify or Webflow.

Tileio sells digital design layers and prompts only: no design, consulting or other services. The businesses in the layer demos are fictional. Free layers are for personal use; commercial use needs Pro or Lifetime.

## Categories

- [Templates](https://tileio.com/templates): 107 layers. Whole landing pages, motion and all.
- [Sections](https://tileio.com/sections): 210 layers. Self-contained page blocks with their motion already wired.
- [Pages](https://tileio.com/pages): 60 layers. Standalone pages with one job: coming soon, 404, pricing, sign-in, résumé, status.
- [Elements](https://tileio.com/elements): 80 layers. One component, one interaction: buttons, cursors, loaders, cards, text and image effects.
- [Vectors](https://tileio.com/vectors): 60 layers. SVG packs drawn to one grid: icons, shapes, dividers, patterns, badges, avatars.
- [3D Scenes](https://tileio.com/3d-scenes): 60 layers. Real-time WebGL: particles, fluid, terrain.
- [Backgrounds](https://tileio.com/backgrounds): 70 layers. Animated backdrops in CSS, SVG or Canvas, a few kilobytes each, ready to sit behind anything.
- [Gradients](https://tileio.com/gradients): 80 layers. Pointer-interactive gradients in pure WebGL, about a kilobyte.

## Collections

- [404 page templates](https://tileio.com/c/404-page-template): Eight standalone 404 pages, from a did-you-mean search to a playable maze, plus a pack of error illustrations for building your own.
- [AI startup website templates](https://tileio.com/c/ai-startup-website-template): Eight AI startup website templates whose hero is a working demo: a streaming playground, a live diff, a support queue, an agent graph, a fraud radar.
- [Animated CSS backgrounds](https://tileio.com/c/animated-background-css): Twelve animated backgrounds whose motion is CSS keyframes: mesh gradients, aurora curtains, fog, stripes and grids, each between 3.5 and 5.2 KB.
- [Animated gradient backgrounds](https://tileio.com/c/animated-gradient-background): Twelve animated gradient backgrounds in WebGL: peach skin, cloud banks, deep sea, candlelight, tie-dye, watercolour, nacre, opal, bokeh, an ice halo.
- [Animated SVG backgrounds](https://tileio.com/c/animated-svg-background): Twelve animated SVG backgrounds: circuit traces with pulses, goo blobs, a hex pulse grid, isometric cubes, moiré rings, contour lines, paper grain, wave lines.
- [Bento grid sections](https://tileio.com/c/bento-grid): Ten bento grid sections, pages and templates where the tiles work: live demos, linked product tiles, scrubbable project frames, stats that switch units.
- [Bolt.new prompts for interactive pages](https://tileio.com/c/bolt-new-prompts): Ten Bolt.new prompts for pages with real logic: an ROI calculator, quizzes, an NPS survey, a booking widget, a status page, help search, a changelog.
- [Button hover effects](https://tileio.com/c/button-hover-effects): Ten button hover effects: magnetic pull, a border beam, shimmer, liquid fill, sliding icons, rolling letters, a glow, a 3D press and a pointer ripple.
- [Canvas background animations (HTML5)](https://tileio.com/c/canvas-background-animation): Twelve HTML canvas background animations: ASCII shimmer, caustic light, a clock grid, cross-hatching, dithering, halftone waves, Game of Life, matrix rain.
- [Card hover effects (CSS and JS)](https://tileio.com/c/card-hover-effect): Twelve card hover effects: 3D tilt with depth, holographic foil, a spotlight border, frosted glass, lift and zoom, flip cards, a fanned hand, magnetic cards.
- [ChatGPT prompts for website design](https://tileio.com/c/chatgpt-website-design-prompts): Ten free ChatGPT prompts for website design: a marquee hero, scroll counters, timelines, a draggable filmstrip, a snapping rail, goal rings, a mini player.
- [Claude website prompts for whole pages](https://tileio.com/c/claude-website-prompts): Ten Claude website prompts for whole pages in one HTML file: four immersive three.js sites, a particle agency, a photographer, a UI library, a tree surgeon.
- [Coming soon page templates](https://tileio.com/c/coming-soon-page-template): Eight coming soon pages and a waitlist template: countdowns, queue positions, launch progress and teasers, each with an email form.
- [Contact form designs](https://tileio.com/c/contact-form-design): Ten contact form designs: floating labels, a multi-step form, a chat-style form, address autocomplete, booking calendars, file upload, triage, office cards.
- [Cursor effects](https://tileio.com/c/cursor-effects): Eleven cursor effects for websites: blend-mode blobs, a dot and ring, image trails, magnetic snapping, a labelled cursor and pointer spotlights.
- [Cursor prompts for landing pages](https://tileio.com/c/cursor-prompts): Ten Cursor prompts that build a landing page in order, navbar to footer, each as a typed component in your repo: hero, logos, features, pricing, FAQ, CTA.
- [Dark landing page templates](https://tileio.com/c/dark-landing-page-template): Twelve dark landing page templates for music, fashion, food, hardware, games and software, each built around one signature interaction.
- [Ecommerce website templates](https://tileio.com/c/ecommerce-website-template): Twelve ecommerce website templates for single-brand shops: sneaker and shoe drops, ceramics, bikes, cosmetics, perfume, coffee, bread and dog treats.
- [Education website templates](https://tileio.com/c/education-website-template): Eight education website templates: an online school, a course presale, a coding bootcamp, a university, a music app, a sailing school, a dive centre.
- [FAQ accordions](https://tileio.com/c/faq-accordion): FAQ sections built on accordions, with search, illustrations and video answers, plus tabbed, sticky, card and chat alternatives.
- [Features section designs](https://tileio.com/c/features-section-design): Ten features section designs: tabs with progress bars, a pinned phone, sticky steps, icons that draw themselves, a spotlight grid, a with/without toggle.
- [Fintech landing page templates](https://tileio.com/c/fintech-landing-page-template): Eight fintech and finance landing page templates: business banking, a payments API, invoicing, fraud scoring, wealth, insurance, carbon accounting.
- [WebGL gradient hero sections](https://tileio.com/c/gradient-hero-section): Twelve WebGL gradients calm enough to sit behind a headline: aurora, dusk, haze, silk and smoke, each one shader that follows the pointer.
- [GSAP website templates](https://tileio.com/c/gsap-templates): Ten GSAP website templates on ScrollTrigger, SplitText, Flip and Draggable with Lenis: blocks that snap into place, a re-typeset lineup, a throwable rail.
- [Hero section designs](https://tileio.com/c/hero-section-design): Ten hero section designs: a bento of live tiles, a dealt card fan, a form-first hero, a gradient sweep, a marquee poster, light rays, scroll-scrubbed video.
- [Interactive gradient backgrounds](https://tileio.com/c/interactive-gradient-background): Twelve WebGL gradients where the pointer does something physical: drops ripples, wipes fogged glass, pulls a spring mesh, realigns iron filings or stirs ink.
- [Light theme landing page templates](https://tileio.com/c/light-landing-page-template): Twelve light landing page templates on paper, stone and white grounds, for accountants, clinics, hotels, florists, shops, studios and trades.
- [Loader animations](https://tileio.com/c/loader-animation): Nine loader animations: a 0 to 100 counter, curtains, a logo that draws itself, a page wipe, skeleton shimmer, a progress ring and three-dot loaders.
- [Logo marquees and logo walls](https://tileio.com/c/logo-marquee): Logo marquees for a trusted-by strip, from a pure-CSS two-row loop to a ticker that stacks into a grid, plus logo walls that flip, orbit and pop over.
- [Lovable prompts for app screens](https://tileio.com/c/lovable-prompts): Ten Lovable prompts for app screens: multi-step sign-up, sign-in, SSO, password reset, a code entry, a dashboard, a kanban board, an inbox, settings, pricing.
- [Next.js landing page templates](https://tileio.com/c/nextjs-landing-page-template): Ten Next.js landing page templates for software: a three.js cloud city, a UI library, an inference API, a password manager, route planning, EV charging.
- [Particle backgrounds](https://tileio.com/c/particle-background): Twelve particle backgrounds: plexus networks, flow fields, fireflies, embers, snow, confetti and starfields in Canvas 2D, plus two three.js point clouds.
- [Portfolio website templates](https://tileio.com/c/portfolio-website-template): Eight portfolio templates for photographers, illustrators, product designers, copywriters and 3D artists, plus four CV and résumé pages.
- [Pricing toggles](https://tileio.com/c/pricing-toggle): Pricing blocks built around a switch (monthly or yearly, yearly or lifetime, currency, differences only) plus a segmented control to add your own.
- [SaaS landing page templates](https://tileio.com/c/saas-landing-page-template): Twelve SaaS landing page templates whose hero is a working demo: a flag console, a live status page, a diff editor, a pipeline board, a dashboard.
- [SaaS pricing sections](https://tileio.com/c/saas-pricing-section): Twelve pricing sections and pages for software: three tiers, a monthly/yearly switch, usage sliders, add-ons, comparison tables and an enterprise quote form.
- [Scroll animation examples for websites](https://tileio.com/c/scroll-animation-examples): Twelve scroll animation sections: video scrubbed by scroll, pinned horizontal galleries, stacking cards, a 3D helix timeline, a tube that fills as you read.
- [Shader backgrounds for websites (WebGL)](https://tileio.com/c/shader-background): Twelve WebGL shader backgrounds for websites: reaction-diffusion, a lava lamp, lightning, a thermal map, an eclipse, moiré, x-ray, stained glass, risograph.
- [Shopify custom sections for product pages](https://tileio.com/c/shopify-custom-sections): Ten Shopify custom sections as Liquid files with schema: a cart drawer, shoppable hotspots, product cards, a compare grid, a size picker, zoom, reviews.
- [Sticky navbars](https://tileio.com/c/sticky-navbar): Sticky navigation bars that hide on scroll, shrink to a pill, flip colour over dark sections or track the section in view, plus rails and a bottom dock.
- [SVG icon packs](https://tileio.com/c/svg-icon-pack): Twelve SVG icon packs of 24 icons each on a 24-pixel grid with a 1.75 px stroke, for interfaces, shops, developers, finance, health, travel and more.
- [Testimonial sections](https://tileio.com/c/testimonial-section): Ten testimonial sections: marquee walls, masonry with filters, post cards, video quotes, rating summaries and single spotlit quotes.
- [Text reveal animations](https://tileio.com/c/text-reveal-animation): Ten text reveal animations: masked line rises, blur-in words, decoding glyphs, stroke-drawn letters, marker highlights, typing and scroll-inked paragraphs.
- [Three.js backgrounds for websites](https://tileio.com/c/three-js-background): Twelve three.js backgrounds: an aurora, a wireframe tunnel, dunes, a hex field, metaballs, a grass meadow, sky lanterns, a laser show, a voxel city.
- [Three.js hero sections](https://tileio.com/c/three-js-hero-section): Twelve three.js scenes built to sit behind a hero headline: particle fields, flow ribbons, a warp tunnel, an ocean, wireframe terrain and liquid chrome.
- [v0 prompts for UI components](https://tileio.com/c/v0-prompts): Twelve v0 prompts for React UI components: a command palette, a dark mode toggle, modals, toasts, a drawer, tag and OTP inputs, a sliding tab bar.
- [Website footer designs](https://tileio.com/c/website-footer-design): Ten website footers: three with a newsletter field, plus reveal footers, giant wordmarks, a live status bar, a visitor map and a mobile accordion.
- [Health and wellness website templates](https://tileio.com/c/wellness-website-template): Eight health and wellness website templates: a thermal spa, a yoga studio, a therapy practice, a physio and a dental clinic, a gym, meal delivery, cosmetics.
- [WordPress landing page templates (Elementor)](https://tileio.com/c/wordpress-landing-page-template): Ten WordPress landing page templates as Elementor HTML blocks: a hotel, a restaurant, a distillery, a festival, walking tours, an airline, coffee, car hire.

## Optional

- [Docs](https://tileio.com/docs): how layers, prompts and stacks work
- [Pricing](https://tileio.com/pricing): Free, Pro, Team and Lifetime
- [Changelog](https://tileio.com/changelog): new layers each week
- [Sitemap](https://tileio.com/sitemap.xml): every layer page