Timelines

Timeline and activity feed variations.

Get Started

1

Responsive Timeline

Notification timeline

Use timelines if you want to display chronological information. This timeline features timeline icons and user avatars. It is responsive by default.

Marjory Cambell
Has locked a set of business documents
30 minutes ago
Henry Rodstein
Has marked 4 invoices as processed and paid.
2 hours ago
Helen Miller
Has uploaded 17 invoices to the processing queue.
Yesterday

Doted timeline

You can display small dots instead of icons if you prefer a lighter layout. Inspect the source to see the markup details

Marjory Cambell
Has locked a set of business documents
30 minutes ago
Henry Rodstein
Has marked 4 invoices as processed and paid.
2 hours ago
Helen Miller
Has uploaded 17 invoices to the processing queue.
Yesterday

Conversation timeline

Timelines can also be used to display message conversations, like inside a support ticket UI for example.

Marjory Cambell
Lorem ipsum dolor sit amet, vel option latine alterum ut, sed ad ludus saperet nominavi. Te exerci libris blandit qui, quo ei lucilius vulputate.
30 minutes ago
Henry Rodstein
Lorem ipsum dolor sit amet, vel option latine alterum ut, sed ad ludus saperet nominavi. Te exerci libris blandit qui.
2 hours ago
Helen Miller
Lorem ipsum dolor sit amet, vel option latine alterum ut, sed ad ludus saperet nominavi. Te exerci libris blandit qui, quo ei lucilius vulputate.
Yesterday
2

Simple Feed

Notification Feed

If timelines dont suit your needs, you can use de the simple activity feed to display notifications or whatever chronological content.

  1. 2 minutes ago Henry Rodstein has marked 4 invoices as processed and paid.
  2. 3 hours ago Marjory Cambell has locked and archived 2 invoices
  3. 5 hours ago Anthony Kowalsky created 2 new opportunities
  4. Yesterday Kareem Jabbar has marked 3 invoices with issues and set their priority to urgent.
  5. Monday Eleanor Briggs uploaded 5 new invoices.
  6. Last week Kevin Smith has marked 9 invoices as processed and paid.

Activity Feed

Avatars can also easily replaced by icons to emphasize your feed content design.

  1. 2 minutes ago Henry Rodstein sent you a Message.
  2. 3 hours ago You have 5 new messages in your inbox.
  3. 5 hours ago 3 more users are now following you.
  4. Yesterday You have 3 overdue invoices pending.
  5. Monday Eleanor Briggs liked your Publication.
  6. Last week Kevin Smith added a new Folder to an ongoing Project.