Software Engineering

Gerador de Sites Completos HTML/CSS/JS

Name: Gerador de Sites Completos HTML/CSS/JS
Author: Claude Directory

Claude Directory December 9, 2025

0 copies 0 likes

Gera sites completos e responsivos em HTML, CSS e JS puro a partir de uma simples descrição. Ideal para protótipos rápidos, landing pages profissionais e aprendizado de frontend sem frameworks (econom

Prompt

Você é um desenvolvedor web full-stack sênior especialista em HTML5, CSS3 e JavaScript vanilla. Sua tarefa é criar um site completo, moderno e totalmente responsivo apenas com HTML5, CSS3 e JavaScript puro (SEM frameworks como Bootstrap, React, etc.).

Baseado na descrição abaixo, gere o código completo do site incluindo:

• Design profissional e moderno (use Flexbox/Grid para layout responsivo)
• Header com navegação fixa/sticky
• Hero section atrativa com call-to-action
• Seções: Sobre, Serviços/Features, Portfólio/Galeria (se aplicável), Depoimentos, Contato com formulário funcional (envio via EmailJS ou simulação com JS)
• Footer com links e copyright
• Animações suaves (CSS transitions/animations ou JS)
• Totalmente responsivo (mobile-first)
• SEO básico (meta tags, alt texts, headings)
• Performance otimizada (imagens placeholder, lazy loading se possível)

DESCRIÇÃO DO SITE: [INSIRA AQUI A DESCRIÇÃO DO SEU PROJETO, ex: "Landing page para agência de marketing digital com seções hero, serviços, cases e contato"]

Saída: APENAS o código HTML completo dentro de uma tag <html> única. Sem explicações ou comentários extras. Nomeie o arquivo como index.html.

How to Use

1. Copie o texto completo do prompt acima. 2. Cole em Claude, ChatGPT ou similar. 3. Substitua '[INSIRA AQUI A DESCRIÇÃO DO SEU PROJETO]' pela ideia do seu site (ex: 'Landing page para cafeteria com menu, galeria de fotos e reservas'). 4. Gere o output e copie o código HTML. 5. Salve como 'index.html' e abra no navegador para testar responsividade. 6. Personalize cores/imagens editando o código gerado. 7. Para formulário funcional, integre EmailJS com sua chave gratuita.

Comments

More Prompts

View all

Research

ChatGPT Web Browsing Research Agent

Structured web research using ChatGPT's browsing capability. Systematic source evaluation, fact-checking, and synthesis with proper citations.

Community

Development

ChatGPT API Integration Blueprint

Design production-ready ChatGPT API integrations. Covers authentication, streaming, function calling, structured outputs, and cost optimization with the latest OpenAI SDK.

Community

Data Analysis

Advanced Data Analysis with Code Interpreter

Step-by-step data analysis pipeline using ChatGPT's Code Interpreter. Upload CSV/Excel files for cleaning, visualization, statistical analysis, and insights.

Community

Productivity

ChatGPT Memory & Personalization Optimizer

Optimize ChatGPT's memory feature for persistent context. Teaches how to structure memories, manage what's stored, and leverage personalization effectively.

Community

Creative

DALL-E 3 Prompt Engineering Master

Generate precise, creative DALL-E 3 prompts. Handles style specifications, aspect ratios, composition rules, and iterative refinement for stunning AI-generated images.

Community

Productivity

ChatGPT Canvas Collaborative Editor

Leverage ChatGPT Canvas mode for iterative document editing, code review, and collaborative writing with inline suggestions and tracked changes.

Community