Template HTML para Currículo Online em uma Página — Grátis e Editável
Template HTML grátis editável para currículo online — link compartilhável que recrutador abre no celular em vez de PDF anexado. Schema.org Person.
Sobre este template
Para quem é este template
Você está buscando uma vaga, freela ou quer parecer profissional online — e cansou de mandar PDF que abre lento, descalibra fonte e some no anexo do e-mail. Quer um link curto, único, no seu nome (carlos-oliveira.htmly.com.br) que recrutador abre no celular durante o trampo, lê em 15 segundos, e que fica salvo no histórico do navegador dele para busca futura. URL bonita também serve para colar no LinkedIn, na assinatura do e-mail, no WhatsApp e onde mais você quiser.
Layout pensado para qualquer área profissional — desenvolvedor, designer, marketing, vendas, advogado, médico, professor, freelancer, consultor, profissional liberal. Header gradient com avatar (iniciais editáveis), 4 contatos clicáveis (e-mail, telefone, LinkedIn, localização), seções de Sobre, Experiência (com período em pílula colorida), Formação, Habilidades com barras de progresso e Idiomas com indicadores de nível em pontinhos. Tipografia Inter, paleta indigo + accent verde água, dark mode automático respeitando preferência do sistema operacional do recrutador.
Por que publicar no Htmly
Template grátis, publicação em 10 segundos, HTTPS automático e link curto compartilhável (carlos-oliveira.htmly.com.br). Edite direto no navegador — clique no nome, no cargo, na empresa, na porcentagem do skill e digite. Sem cadastro para testar. Quando estiver pronto, cole o link no LinkedIn, na assinatura do e-mail, no WhatsApp ou no QR Code do seu cartão de visita. Domínio próprio (carlosoliveira.com.br) disponível no plano Pro para ficar ainda mais memorável.
Próximos passos
Profissionais criativos (designer, fotógrafo, ilustrador, arquiteto) ganham mais combinando o currículo online com um portfólio visual — o template de portfólio profissional entrega exatamente isso, com galeria de cases lado a lado. Se quer gerar uma landing page totalmente customizada com IA para o seu nicho, use o construtor de landing page com IA. Para entender o fluxo completo, o guia completo de criar site com IA cobre as decisões de conteúdo. E para domínio próprio (carlosoliveira.com.br), confira os planos com domínio próprio.
O que vem incluído
- ✓Header gradient com avatar de iniciais editáveis, nome em destaque e cargo abaixo — sem precisar de foto se preferir
- ✓Quatro contatos clicáveis no header: e-mail (mailto), telefone (tel), LinkedIn (URL) e localização (cidade + status remoto opcional)
- ✓Section 'Sobre mim' pra resumo profissional de 1-2 parágrafos em destaque
- ✓Experiência profissional com 3 cards de exemplo (cargo, empresa, período em pílula colorida, 3 bullets de conquistas) — duplique pra adicionar mais
- ✓Formação acadêmica com 2 cards (curso, instituição, período) — fácil de duplicar pra cursos extras
- ✓Habilidades técnicas com 6 skill bars de progresso e porcentagem editável diretamente no `style="width: XX%"`
- ✓Idiomas com indicadores visuais de 5 níveis em pontinhos (Nativo, Avançado, Intermediário, Básico, Iniciante)
- ✓Schema.org `Person` inline com `jobTitle`, `alumniOf` e `knowsAbout` — Google entende você como profissional sem você configurar nada
- ✓Dark mode automático via `prefers-color-scheme` — respeita preferência do sistema do recrutador
- ✓Tipografia Inter com fluidez clamp, paleta indigo + accent verde água, espaçamento generoso e tipografia legível
- ✓Mobile-first — recrutador lê confortavelmente no celular durante o expediente, no transporte ou em qualquer aparelho
- ✓Acessível (WCAG AA, focus-visible, navegação por teclado, `prefers-reduced-motion`, alt em ícones SVG)
- ✓HTML estático aberto — você pode baixar o código, editar localmente em qualquer editor e hospedar onde preferir
Como personalizar com IA
- 1Peça ao ChatGPT: 'reescreva este currículo HTML pra um(a) [SEU CARGO/ÁREA] com [X] anos de experiência em [SUAS EMPRESAS], mantendo as 6 seções (sobre, experiência, formação, habilidades, idiomas, contato) e adaptando as 6 skill bars pras competências reais da minha área'
- 2Atualize as iniciais do avatar em `<div class="avatar">CO</div>` pras suas iniciais e mude o `<h1>` pro seu nome completo + o `.role` pro seu cargo principal
- 3Edite o Schema.org `Person` no `<head>` — troque `name`, `jobTitle`, `alumniOf` (universidade), `knowsAbout` (lista de competências). O Google indexa essas informações no Knowledge Panel quando alguém busca seu nome
- 4Personalize as skill bars — busque por `style="width: XX%"` em cada `.skill-fill` e ajuste a porcentagem (95% pra 'Avançado', 80% pra 'Intermediário', 60% pra 'Básico'). Pra adicionar nova skill, duplique o `.skill-item`
- 5Personalize a paleta no bloco `:root` do `<style>` — `--color-primary` (indigo) e `--color-accent` (verde água) definem o tom geral. Pra área criativa, troque pra rosa-magenta `#e91e63` + amarelo `#fbc02d`. Pra área jurídica/financeira, troque pra azul-marinho `#1a237e` + dourado `#c9a56b`. Mantenha bom contraste WCAG
Perguntas frequentes
Funciona pra qualquer área profissional ou só pra dev?▾
Qualquer área. As 6 seções (sobre, experiência, formação, habilidades, idiomas, contato) servem pra qualquer carreira. As skill bars com porcentagem editável funcionam pra hard skills (TypeScript, AutoCAD, Excel avançado, SAP, atendimento ao cliente) e soft skills (gestão de equipe, negociação, oratória, gestão de projetos). A paleta indigo é neutra; troque pra rosa, dourado ou azul-marinho conforme sua área.
Por que um link em vez de um PDF?▾
Recrutador hoje abre vagas pelo celular. PDF abre lento, descalibra fonte e some no anexo do e-mail. Um link curto carrega instantâneo, fica salvo no histórico do navegador, é compartilhável no LinkedIn e WhatsApp e funciona como mini-portfólio. PDF continua útil pra processos formais que exigem anexo — você pode imprimir o link no navegador (Ctrl+P → 'Salvar como PDF') e mandar quando precisar.
Recrutador encontra meu currículo no Google quando buscar meu nome?▾
Sim, com 2 ajustes. Edite o `<title>` da página pra incluir seu nome completo + cargo principal (ex: 'Carlos Oliveira — Engenheiro de Software Sênior'). Atualize o Schema.org `Person` no `<head>` com seu nome, jobTitle, e-mail e cidade. Sitemap automático no Htmly + indexação Google levam de 1 a 4 semanas pra aparecer na busca. Domínio próprio (`seunome.com.br`) acelera. Pra caçadores de talento, virar resultado orgânico pelo seu nome é o melhor cenário possível.
Posso esconder seções que não uso (idiomas, habilidades, formação)?▾
Sim. Cada section é uma `<section class="card">` independente — pra esconder, basta apagar a section inteira ou comentar com `<!-- ... -->`. Pelo editor visual do Htmly, dá pra ocultar selecionando o bloco e clicando em 'remover'. As outras seções se ajustam automaticamente sem quebrar layout — não tem dependência cruzada entre os cards.
Posso usar domínio próprio (`meunome.com.br`) em vez de subdomínio Htmly?▾
Sim, no plano Pro. Você registra o domínio onde preferir (Registro.br, GoDaddy etc.) e aponta pro Htmly via CNAME — fazemos a configuração SSL automática via Cloudflare for SaaS. Subdomínio grátis (`seunome.htmly.com.br`) também funciona pra sempre, sem expirar — e já é mais memorável que `linkedin.com/in/seunome` com hash.