Skip to content

Button Texts

The buttonTexts prop is a useful feature that allows you to modify the text of various buttons in the control panel. These buttons include the play/pause button, the forward button, and the backward button. By customizing the text, you can tailor the user interface to match the requirements of your project.

To use the buttonTexts prop, simply pass an object with custom button text to the component. The object should consist of key-value pairs that map to specific buttons. For instance, if you want to change the text of the play button, you can use the play key and assign it a new label.


Here's an example that shows how to customize the text for the first, last, next, and previous buttons:

import { Chrono } from "react-chrono";

const Timeline = () => {
  return (
        first: "Jump to First",
        last: "Jump to Last",
        next: "Next",
        previous: "Previous",

export default Timeline;

All Available Keys

KeyDescriptionDefault Value
darkSwitches to Dark Mode"Switch to Dark Mode"
firstGoes to the first item in the timeline"Go to First"
lastGoes to the last item in the timeline"Go to Last"
lightSwitches to Light Mode"Switch to Light Mode"
nextGoes to the next item in the timeline"Next"
playStarts a slideshow with the timeline items"Play Slideshow"
previousGoes to the previous item in the timeline"Previous"
stopStops a running slideshow"Stop Slideshow"

By utilizing the buttonTexts prop, you can enhance the usability and accessibility of your timeline component.

Released under the MIT License.