🛠️ Logos de Ferramentas - Officeless Tools

Este diretório contém os logos das 30 ferramentas mais utilizadas por equipes híbridas e remotas.

📋 Lista de Logos Necessários

📱 Comunicação & Chat (6)

[ ] slack.svg - Slack
[ ] teams.svg - Microsoft Teams
[ ] discord.svg - Discord
[ ] whatsapp.svg - WhatsApp Business
[ ] telegram.svg - Telegram
[ ] twist.svg - Twist

🎥 Videoconferência (4)

[ ] zoom.svg - Zoom
[ ] meet.svg - Google Meet
[ ] loom.svg - Loom
[ ] whereby.svg - Whereby

📋 Gestão de Projetos (8)

[ ] asana.svg - Asana
[ ] trello.svg - Trello
[ ] monday.svg - Monday.com
[ ] clickup.svg - ClickUp
[ ] linear.svg - Linear
[ ] notion.svg - Notion
[ ] jira.svg - Jira
[ ] basecamp.svg - Basecamp

📄 Documentos & Conhecimento (4)

[ ] google-workspace.svg - Google Workspace
[ ] microsoft-365.svg - Microsoft 365
[ ] confluence.svg - Confluence
[ ] dropbox.svg - Dropbox

🎨 Design & Criação (4)

[ ] figma.svg - Figma
[ ] miro.svg - Miro
[ ] canva.svg - Canva
[ ] figjam.svg - FigJam

💻 Desenvolvimento (4)

[ ] github.svg - GitHub
[ ] gitlab.svg - GitLab
[ ] vscode.svg - VS Code
[ ] postman.svg - Postman

🔗 Onde Conseguir os Logos

Opção 1: SVG Logos (Recomendado)

Site com logos SVG oficiais de alta qualidade:

URL: https://svgporn.com/
URL: https://worldvectorlogo.com/
URL: https://simpleicons.org/

Opção 2: Sites Oficiais

Baixar diretamente dos press kits das empresas:

Ferramenta	Press Kit URL
Slack	https://slack.com/media-kit
Figma	https://www.figma.com/community/file/821397575362856340
Notion	https://www.notion.so/front/shared/logos.zip
Linear	https://linear.app/branding
GitHub	https://github.com/logos
Asana	https://asana.com/company/press
Trello	https://trello.com/about
Zoom	https://zoom.us/brandguidelines
Miro	https://miro.com/brand/
Canva	https://www.canva.com/newsroom/brand-assets/

Opção 3: Simple Icons (NPM Package)

bun add simple-icons

Opção 4: CDN (Uso Direto)

Usar CDN do Simple Icons:

<img src="https://cdn.simpleicons.org/slack" alt="Slack">
<img src="https://cdn.simpleicons.org/figma" alt="Figma">
<img src="https://cdn.simpleicons.org/notion" alt="Notion">

📐 Especificações Técnicas

Formato

Tipo: SVG (preferencial) ou PNG transparente
Tamanho: Vetorial (SVG) ou mínimo 512x512px (PNG)
Cores: Original (grayscale aplicado via CSS)

Nomenclatura

Minúsculas
Sem espaços (use hífen)
Extensão .svg
Exemplo: google-workspace.svg, microsoft-365.svg

Otimização

Após baixar os SVGs, otimize com:

# Via SVGO (se instalado)
bun add -D svgo
bunx svgo -f ./src/assets/images/tools

🎨 Como Serão Usados

Os logos serão renderizados com:

Tamanho: 64px × 64px
Filtro: grayscale(100%) + opacity: 0.3
Hover: Remove grayscale, aumenta opacity
Container: 120px × 120px com border e background

🚀 Próximos Passos

Baixar os 30 logos SVG
Salvar neste diretório com nomenclatura correta
Otimizar com SVGO (opcional)
Verificar se todos estão listados abaixo

✅ Logos Disponíveis

Lista será atualizada conforme os logos forem adicionados