Generator CSS Cubic Bezier
Seret kalih gagang kangge ngatur kurva easing, pirsani gerakan titik dibandhingake karo kacepetan konstan, lan salin nilai cubic-bezier().
cubic-bezier(0.25, 0.1, 0.25, 1)Kurva dipungambar langsung wonten ing browser panjenengan. Boten wonten data ingkang dipununggah dhateng BroBroGo.
FAQ
Menapa tegesipun kalih gagang lan sekawan angka kasebat?
Kurva mlampah saking kiri-ngandhap (awal) dhateng tengen-nginggil (pungkasan), kanthi wektu mlampah mangiwa-manengen lan progres minggil. Kalih gagang kasebat minangka titik kontrol ingkang mlengkungaken kurva — saben gagang gadhah nilai X lan Y, saengga dipunserat cubic-bezier(x1, y1, x2, y2). Nilai X tetep antawisipun 0 lan 1, dene Y saged nglangkungi wates nginggil utawi ngandhap.
Kadospundi caranipun ngginakaken nilai punika wonten ing CSS kula?
Salin cubic-bezier() lan pasang wonten ing pundi kemawon fungsi wektu dipunginakaken — transition-timing-function, animation-timing-function, utawi wujud cekak sanesipun, contonipun transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1). Tembung kunci ease, ease-in, ease-out, lan ease-in-out punika namung kurva cubic-bezier ingkang sampun tetep.
Menapa saged damel efek mantul (bounce) utawi elastis?
Mboten saged piyambakan. Kurva cubic-bezier tunggal saged nggambaraken antisipasi lan overshoot — setelan "back" saged narik gagang nglangkungi kothak kangge nindakaken bab kasebat — nanging namung saged mindhah dhateng satunggal arah banjur mandheg. Efek mantul (bounce) lan elastis mbetahaken owah-owahan arah sawetara kali, saengga mbetahaken CSS keyframes utawi fungsi linear().