📈 Editor CSS cubic-bezier

Edita cubic-bezier arrastando dois pontos de controle. Confirme o movimento com a animação de pré-visualização.

100% Free No signup Browser-only 5 languages Dark mode

🔒 Sobre Privacidade

・Todo o processamento é concluído dentro do navegador
・Os dados de entrada não serão enviados para o servidor sob nenhuma circunstância
・Não há logs de salvamento · histórico · banco de dados etc.
・Nenhum registro, login ou cobrança necessária

Arraste os pontos azuis e rosa para editar a curva

Visualizar

Predefinição

CSS

📖 Como usar

1

Drag the control points

Drag the blue and pink points to reshape the curve. The curve becomes the timing function.
2

Preview the motion

Press Play to animate the red dot and see the actual easing.
3

Copy the CSS

Copy the generated transition / animation snippet and paste into your CSS.

❓ Perguntas frequentes

Is my data sent to your server?

No. Everything runs in your browser. You can verify in the Network tab.

Can Y values go outside the 0-1 range?

Yes. Y can exceed 0-1 for bounce or overshoot effects. X must stay within 0-1.

Where can I use this?

Use it in CSS transition-timing-function and animation-timing-function properties.

🔗 Ferramentas relacionadas

🐛 Você encontrou um problema com esta ferramenta?

Completamente gratuito e sem registro. Até as etapas de reprodução são suficientes. Os relatos recebidos chegam diretamente aos operadores e servem como referência para correções.