StealThis .dev

Copie estes designspáginascomponentesanimaçõespadrõesremotionmúsicadatabasesskillsarquiteturas3DpromptsMCPs designs - tudo grátis para copiar.

Snippets e demos prontos para uso. MCP incluído. Navegue, copie, integre.

725 Recursos
17 Categorias
MIT Licença

Abra demos executáveis direto no Lab. Compare dificuldade, confira tags de stack e escolha a referência certa antes de construir.

Ver tudo →
Componentes UI Easy

Menu Item Detail

Restaurant dish detail card with image area, allergen chips, modifier picker (size, doneness, extras), quantity stepper and add-to-order CTA with live total.

Páginas Easy

Restaurant About / Our Story

Editorial About page — chef portrait, founding story, 4-step timeline, team grid, values and a press wall — in the shared warm restaurant palette.

Páginas Easy

Private Events & Catering

Private dining and catering page — three package cards with capacity, sample menu, capacity table, FAQ accordion and an enquiry form with availability hint.

Componentes UI Easy

Order Status Tracker

Customer-facing order tracker — Sent → Cooking → Ready → Out for delivery → Delivered stepper with live ETA, courier card, simulated tick-through, and item summary.

Páginas Easy

Location & Hours

Restaurant Find Us page — SVG map placeholder with pin, hours table with current-day highlight, transit + parking cards, contact form, and a print-friendly directions card.

Páginas Easy

Restaurant Gallery / Chef's Specials

Photo gallery with category filter chips, masonry-style grid of CSS-gradient placeholders, hover overlays, and a click-to-open lightbox with prev/next + keyboard navigation.

Componentes UI Easy

Printable Receipt

Thermal-style restaurant receipt — header, line items with modifiers, subtotal/tax/tip/total, payment line, QR barcode placeholder and @media print styles for actual printing.

Componentes UI Easy

Loyalty / Rewards Card

Customer loyalty card with 10-visit progress, animated stamps, 3-tier rewards ladder, faux barcode and member meta. Tap a stamp to flip — earn the reward at 10.

Componentes UI Easy

Tip & Split Calculator

Standalone tip calculator with N-way split, tip presets + custom %, pre-tax / post-tax tip basis toggle, and round-up to a friendly number.

Componentes UI Easy

Reviews Feed

Customer review feed: aggregated score with 5-star breakdown bars, filter chips (all · recent · 5★ · with photos), tag pills, helpful counter and owner replies.

Componentes UI Easy

Call Waiter · Service Request

Tableside service request panel — six common requests (water, bread, menu, allergy, bill, photo), live status pill, cancel before staff confirm, and a short note field.

Modelos 3D Easy

3D Floating Geometric Shapes

Ten distinct Three.js geometric shapes floating in space with sine-wave drift, self-rotation, and a mouse parallax camera effect.

Páginas Medium

Italian Trattoria Landing — Trattoria del Forno

Rustic trattoria landing — cream + tomato + olive, Playfair Display + Dancing Script handwritten accents, checkered tablecloth divider, Italian menu copy.

Páginas Medium

Customer Checkout

Three-step restaurant checkout — pickup vs delivery, time slot picker, contact + payment with tip presets — and a confirmation success screen.

Páginas Medium

Farm-to-Table Landing — Sage & Stone

Earthy farm-to-table landing — sage + bone + clay palette, Fraunces display + Inter Tight body, organic curves, weekly garden harvest tally, and a no-menu tasting reveal.

Páginas Medium

Mexican Cantina Landing — La Catrina

Vibrant cantina landing — terracotta + cobalt + mustard, Fraunces display, CSS papel picado strip, taco menu, mezcal flight and Spanish-language copy.

Componentes UI Medium

Restaurant Cart / Order Summary

Customer order summary widget — line items with modifiers, quantity steppers, subtotal/tax/tip/total, gratuity presets and a send-to-kitchen CTA.

Páginas Medium

Restaurant Menu — Carta

Browseable restaurant menu (carta) with sticky category nav, search filter, allergen chips, and section anchors. Shared warm restaurant palette.

Páginas Medium

QR Mobile Menu

Mobile-first restaurant menu opened from a table QR code — sticky scroll-spy category bar, single-column dish list with chips, and a floating cart pill that opens a bottom-sheet order summary.

Páginas Medium

Sushi / Omakase Landing — Kuro

Sushi & omakase landing — zen minimalism in bone + ink + vermillion, Noto Serif JP display, ink-wash divider, seat counter, and a 13-course omakase progression.

Páginas Medium

Restaurant Landing Page

Generic restaurant landing — sticky nav, editorial hero, signature dishes, chef story, hours strip, and a reserve CTA in the shared warm Casa Olivar palette.

Componentes UI Medium

POS — Payment Terminal

Restaurant payment terminal: cash / card / split tabs, tip presets, on-screen amount keypad, change calculator, and a confirmed-payment view.

Páginas Medium

Restaurant Menu Page (Editorial)

Editorial, printable two-column menu page — dotted-leader prices, course separators, wine pairings sidebar, allergen legend, and @media print styles for an A4 PDF.

Componentes UI Medium

POS Quick Order Pad

Staff-facing POS quick pad: category tabs, tap-to-add menu grid, running ticket panel with line items, qty steppers, modifiers and total. Built for touch.

Páginas Hard

Self-Ordering Kiosk

Customer self-ordering kiosk — vertical layout, 72px touch targets, language switcher, animated welcome → category → item-detail → cart → pay flow.

Páginas Hard

Steakhouse Landing — Vault & Ember

Premium steakhouse single-page landing — dark charcoal + leather + gold, Cormorant Garamond display, smoke textures, dry-age tally and cellar drawer.

Páginas Hard

Kitchen Display System (KDS)

Restaurant Kitchen Display — four-column ticket flow (New · Cooking · Ready · Served) with age-coloured cards, line check-off, advance / recall actions, and a live timer.

Páginas Hard

POS — Order Entry Terminal

Full restaurant POS terminal with category sidebar, menu grid, live ticket panel, modifier sheet, course splitter, and Send / Hold / Print / Pay actions.

Páginas Hard

Restaurant Floor Plan

Responsive SVG restaurant floor plan — tables in real coordinates, status badges, side inspection, and an edit mode for adding, moving, resizing, reshaping, duplicating, or removing tables.

Páginas Hard

Admin — Sales & KPI Dashboard

Restaurant manager dashboard — covers, average check, turn time, 7-day revenue SVG line chart, top items list, hourly heatmap, today's reservations preview.

Componentes Hard

Hero Code Space Background

Immersive 3D perspective background with floating code panels, scroll-driven depth animation, and responsive depth culling.

Arquiteturas Hard

Micro-Frontend Architecture (Module Federation)

Micro-frontend pattern using Webpack Module Federation with independent host/remote applications sharing dependencies at runtime.

Arquiteturas Hard

Event Sourcing + CQRS Architecture

Event sourcing pattern with append-only event store, aggregate roots, projections, CQRS read/write separation, and event replay for state reconstruction.

Arquiteturas Hard

Turborepo Monorepo Architecture

Turborepo monorepo structure with shared packages, task pipelines, remote caching, and parallel execution for multi-app projects.

Arquiteturas Hard

Nx Monorepo Architecture

Nx monorepo with project graph, affected commands, computation caching, and the 80/20 apps-to-libs split pattern.

Arquiteturas Hard

T3 Stack Architecture

Full-stack T3 architecture with end-to-end type safety — Next.js App Router, tRPC, Prisma/Drizzle, NextAuth, and type-safe environment variables.

Componentes UI Hard

ARIA Combobox

Accessible combobox autocomplete implementing ARIA 1.2 combobox pattern with keyboard navigation and screen reader support.

Componentes UI Hard

ARIA Tree View

Accessible tree view component with full keyboard navigation and ARIA tree roles for hierarchical data display.

Boilerplates Hard

T3 Stack Starter (Next.js + tRPC + Prisma)

The T3 Stack — fully type-safe full-stack starter with Next.js, tRPC, Prisma/Drizzle, NextAuth, Tailwind, and validated environment variables.

Componentes UI Hard

Color Blind Modes

Color vision deficiency simulation with toggleable modes for protanopia, deuteranopia and tritanopia using SVG filters.

Componentes UI Hard

Arc Timeline

A timeline displayed along a curved semicircle arc. Events are positioned radially with connecting dots, creating a unique non-linear timeline visualization.

Componentes UI Hard

Interactive 3D Globe

Interactive 3D globe rendered on canvas with dot-matrix sphere, auto-rotation, and drag-to-rotate interaction — no Three.js required.

Páginas Ultra Alta Definição Hard

Uber UHD Ride-Share Landing Page

A premium dark-themed ride-share landing page inspired by Uber — featuring animated gradient mesh backgrounds, glassmorphism booking cards, CSS-only vehicle illustrations, scroll-pinned feature reveals, animated stat counters, and a phone app mockup with parallax tilt.

Páginas Ultra Alta Definição Hard

Spotify UHD Music Streaming Landing Page

A premium dark-themed music streaming landing page inspired by Spotify — featuring animated gradient mesh backgrounds, glassmorphism playlist cards, CSS-only album art, scroll-pinned feature reveals, animated stat counters, and a phone app mockup with Now Playing UI and parallax tilt.

Navegue por categoria

Construa com controle

Pegue o que funciona. Entregue o que você quer.

Para pessoas e bots que querem construir software sem começar do zero.

StealThis é uma biblioteca orientada por referências. Revise cada elemento, entenda como ele funciona e reutilize no seu próprio stack. Menos fragmentação, menos complexidade e mais controle sobre o sistema visual e as ferramentas com que você quer construir.

O objetivo é simples: um lugar colaborativo onde conhecimento, práticas comprovadas e referências prontas para produção convivem. Você escolhe uma base, adapta e segue em frente sem reconstruir os fundamentos toda vez.

Como usar este lugar

01 Encontre uma referência que já resolva parte do seu problema.

02 Entenda rápido: estrutura, comportamento e detalhes de implementação.

03 Adapte ao seu sistema visual, stack e restrições.

04 Entregue mais cedo sem sacrificar a qualidade do código.

Menos boilerplate. Menos troca de contexto. Mais construção.

O que você ganha na prática

Você ganha uma primeira versão mais rápida, referências de implementação mais fortes e menos recomeços sem saída. Em vez de costurar contexto de dez fontes diferentes, você trabalha a partir de um único lugar e avança com intenção.

A Velocidade com controle: comece de uma base real e mantenha seus próprios padrões.

B Linguagem compartilhada: pessoas e bots podem raciocinar a partir das mesmas referências.

C Conhecimento acumulado: cada reutilização facilita a próxima build.

Direção futura: sistemas visuais personalizados, configurações de fluxo de trabalho personalizadas e criação de software de qualquer lugar com as suas próprias regras.

Roadmap em andamento

Das fundações a um framework web AI-first

Estamos construindo isso em público, passo a passo. O caminho começa com fundações fortes, depois qualidade de documentação, depois fluxos de geração de projetos e por fim um framework leve para construir software web com suporte de IA.

Construir a fundação

Estabilizar a arquitetura base, as páginas principais, os primitivos reutilizáveis e a linguagem visual.

Melhorar a docs com boas práticas

Tornar a orientação mais clara, prática e acionável para que as pessoas implementem mais rápido e com menos confusão.

Melhorar o builder para criação de projetos

Reduzir o atrito de setup e tornar o scaffolding de projetos mais controlável a partir de referências.

Criar o framework básico do StealThis

Um framework simples para projetos web, inspirado em fluxos no estilo Astro e focado em criação assistida por IA.

Linguagem do projeto

As palavras que definem este projeto

Não são termos de marketing. São princípios operacionais para como construímos, compartilhamos e entregamos software com menos complexidade e mais propriedade.

CONTROLE

Controle significa escolher seu stack, seu sistema visual e seu ritmo de entrega sem ficar preso a padrões rígidos.

REFERÊNCIA

Referência significa aprender com implementações concretas, não com fios abstratos espalhados por fontes desconectadas.

REUSO

Reuso é o padrão. Comece de uma base comprovada, adapte e gaste energia em diferenciação, não em repetição.

COLABORAÇÃO

Colaboração significa pessoas e bots construindo a partir do mesmo contexto, das mesmas convenções e das mesmas referências de produção.

PRÁTICA

Prática é onde a qualidade aparece: fluxos repetíveis, padrões testados e disciplina de implementação.

PROPRIEDADE

Propriedade significa entender o que você roda, por que funciona e como evoluir quando os requisitos mudam.

CLAREZA

Clareza remove atrito: um lugar para referências, uma linguagem para decisões, um caminho da ideia até a entrega.

ENTREGA

Entrega significa chegar à produção mais cedo sem baixar o padrão de arquitetura, acessibilidade e manutenibilidade.

Filosofia Steal This

Palavras que revelamos enquanto construímos

Cada linha abaixo é um compromisso com uma forma mais prática de construir software: referências sólidas, contexto compartilhado e execução mais rápida com controle.