Modo de manutenção

Cal.com Atoms estão em modo de manutenção

As integrações existentes continuam a receber correções e novas versões npm, mas não haverá novos Atoms. Estás a integrar agendamento no teu próprio produto, para os teus próprios utilizadores? Isso agora é coss.com Scheduling. Estás a desenvolver sobre a tua própria conta Cal.com? Usa API v2.

appearance.tsLive preview
1// Style Atoms with Javascript23const appearance = {4  theme: Custom,5  variables: {6    fontFamily: 'Comic sans',7    colorPrimary: '#101010',8    colorBackground: '#ffffff',9    colorText: '#374151',10    borderRadius: '6px',11    spacingUnit: '8px',12  }13};14const atoms = cal.atoms({ clientSecret, appearance });15

Cédric van Ravesteijn

Why Cal.com is better than Calendly

Ready to see why Cal.com outshines Calendly? Spoiler alert: it's not even close!

15m30m45m1h

Cal Video

Europe/Amsterdam

May 2025

SUNMONTUEWEDTHUFRISAT12345678910111213141516171819202122232425262728293031

Com a confiança de empresas em rápido crescimento em todo o mundo

Componentes personalizáveis para qualquer fluxo de trabalho de agendamento

Atoms são componentes React para cada parte do agendamento: ligar calendários, definir disponibilidade, criar links de agendamento e aceitar reservas.

@calcom/atoms
1import { Connect } from "@calcom/atoms";23export default function Connect() {4  return (5    <>6      <Connect.GoogleCalendar isMultiCalendar={true} />7      <Connect.OutlookCalendar isMultiCalendar={true} />8      <Connect.AppleCalendar isMultiCalendar={true} />9    </>10  )11}
Integrações existentes

Como funcionam os Atoms

Para equipas que já usam Atoms: um fluxo de trabalho de agendamento totalmente em conformidade em poucas linhas de código.

01

Integrar

Por agora, os Cal Atoms podem ser usados com react.js. Depois de instalados, podes usar os componentes na tua aplicação do lado do cliente.
1import { CalProvider, Booker } from "@calcom/atoms";23export default function App() {4  return (5    <CalProvider accessToken="30AadwEContactSalesToGetAKey42069">6      <Booker username="jane-doe" eventSlug="weekly-sync" />7    </CalProvider>8  );9}
02

Personalizar

Cada Atom pode ser totalmente configurado para corresponder à tua marca.

Primary color

Text color

Background

FFFFFF E6E7E4

Text color

242424 FFFFFF
03

Recolher

Depois de o teu Atom estar integrado e estilizado, podes começar a aceitar reservas!

This event is scheduled

We emailed you and the other attendees a calendar invitation with all the details.

WhatDesign WorkshopWhenFriday, 16 June 2022
9:00 am – 10:00 am (Europe/Dublin)

Seguro, em conformidade e totalmente personalizável

Os Cal Atoms foram concebidos para simplificar o processo de criar fluxos de trabalho de agendamento em conformidade. São flexíveis, seguros e totalmente em conformidade com HIPAA, etc.

Totalmente em conformidade e seguro

Os Cal Atoms estão totalmente em conformidade com normas como HIPAA, SOC 2 e GDPR.

Infinitamente personalizável

Escolhe os Atoms de que precisas e adapta-os ao visual e ao estilo do teu site com estilização ao nível de CSS.

Integração fácil

Os Cal Atoms simplificam o processo de integração, permitindo que programadores adicionem capacidades de agendamento poderosas em horas, não semanas.

Vários componentes

Quer estejas a recolher informações dos convidados ou dados de pagamento, há um Atom para isso.

Fiável e escalável

Os Cal Atoms são construídos sobre a base de agendamento robustíssima da Cal.com. Já agendámos milhões de reservas até hoje.

Suporte de tradução

Dá suporte a vários idiomas ao passar um objeto de traduções a qualquer Cal Atom.

Configurável por natureza

Configura erros, breakpoints e estados de carregamento usando uma API simples.

Feito para programadores

Cal.com foi criado por programadores, para programadores. A nossa documentação completa e os recursos para programadores tornam a integração simples.

O poder da personalização sem a dor de criares tudo tu

Os Cal Atoms podem adaptar-se a um número quase ilimitado de casos de uso. Abaixo estão apenas alguns dos mais comuns.

hHiring marketplace
hire.com

Education marketplace

Hire a freelancer for XYZ

Search... Filter
Anna KendrickCo-Founder

Department

MarketingSales

Qualifications

SEOMarketing

Location

US
Chris WashingtonEngineering Lead

Department

Engineering

Skills

Front-EndBack-EndAI

Location

Germany
Alex FisherProduct Lead

Department

Product

Skills

DesignUIUX

Location

Mexico
Dominique SchutteHuman Resource

Department

Human resource

Skills

PayrollHuman resource

Location

Turkey
Joe BergerCTO
Anna FritzHead of Operations
Ralph BakerCEO
Jane DoeHuman Resource Manager
yourapp.comBookerAvailabilityCalendars

Componentes plug & play

Nós tratamos dos problemas de fuso horário, para que tu te possas focar em criar as partes do teu negócio que entregam valor aos teus clientes.