https://github.com/ataldaaiume/carta

💌 Uma cartinha interativa com animações feitas em HTML, CSS e JS puro. Feita com carinho para enviar a alguém especial — ou personalizar e transformar em sua própria mensagem.
https://github.com/ataldaaiume/carta

animation animations art arte css3 cute html5 javascript js love project special study

Last synced: 5 months ago
JSON representation

💌 Uma cartinha interativa com animações feitas em HTML, CSS e JS puro. Feita com carinho para enviar a alguém especial — ou personalizar e transformar em sua própria mensagem.

• Host: GitHub
• URL: https://github.com/ataldaaiume/carta
• Owner: ATalDaAiume
• Created: 2025-04-08T05:08:13.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2025-04-10T04:12:04.000Z (about 1 year ago)
• Last Synced: 2025-05-08T19:17:13.915Z (about 1 year ago)
• Topics: animation, animations, art, arte, css3, cute, html5, javascript, js, love, project, special, study
• Language: HTML
• Homepage: https://ataldaaiume.github.io/Carta/
• Size: 10.7 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 💌 Carta Interativa com Bilhete Animado

Projeto simples e delicado feito com HTML, CSS e JavaScript puro. A "Carta" é uma página interativa com ilustrações fofinhas (desenhadas por mim!) que simula a abertura de uma carta e a revelação de um bilhete animado — perfeita para enviar a alguém especial.

## ✨ Destaques

- Totalmente responsivo, funciona em celulares e desktops 📱💻  

- Animações suaves e visuais feitos com carinho  

- Funciona em **um único arquivo** `.html` — sem necessidade de descompactar nada  

- Ideal para ser enviado diretamente ou hospedado em qualquer lugar

## 🛠️ Tecnologias Utilizadas

- **HTML5**

- **CSS3** (com animações personalizadas)

- **JavaScript Vanilla** (sem bibliotecas externas)

## 🖼️ Visual (modo desktop)

| Carta Fechada | Aba da carta aberta | Parte de baixo da carta | Bilhete Expandido |

|---------------|---------------------|-------------------------|-------------------|

| ![Carta Fechada](https://i.postimg.cc/bNpzhyFV/1743034207469.png) | ![Aba da carta aberta](https://i.postimg.cc/pLWr2FQv/Carta-20250408013548.png) | ![Parte de baixo da carta](https://i.postimg.cc/2Sj84kQL/1743034329685.png) | ![Bilhete](https://i.postimg.cc/XNKy44Mw/Carta-20250408014503.png) |

## 🚀 Como Usar

1. Clone o repositório ou baixe o arquivo `.html`.

2. Abra o arquivo diretamente no navegador.

3. Clique na carta e veja a magia acontecer. ✨

4. Ou, se preferir, **basta enviar o link [ataldaaiume.github.io](https://ataldaaiume.github.io/Carta/)** — além de prático, isso também ajuda a divulgar meu perfil do GitHub 💜

## 📦 Compartilhando com Alguém

- O projeto está disponível em: **[ataldaaiume.github.io](https://ataldaaiume.github.io/Carta/)**  

- Você pode simplesmente copiar o link e enviar para quem quiser! É rápido, bonito e ainda ajuda a divulgar meu perfil no GitHub 💜  

- Se preferir enviar diretamente, também pode baixar o `.html` e enviar por mensagem ou e-mail.

## 📝 Observações

- As imagens são hospedadas externamente via PostImage.

- Se quiser personalizar o bilhete (por exemplo, mudar a mensagem ou as imagens para enviar a outra pessoa), você pode:

  - Baixar o arquivo `.html`;

  - Editar os textos e substituir os links das imagens direto no código;

  - Todos os links das imagens estão comentados ou facilmente localizáveis dentro do próprio HTML.

- Feito com muito carinho 💖