diff --git a/docs/lib/examples/CarouselUncontrolled.js b/docs/lib/examples/CarouselUncontrolled.js
index daa757bad..1d29eb8c4 100644
--- a/docs/lib/examples/CarouselUncontrolled.js
+++ b/docs/lib/examples/CarouselUncontrolled.js
@@ -6,19 +6,22 @@ const items = [
     src: 'data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15ba800aa1d%20text%20%7B%20fill%3A%23555%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15ba800aa1d%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22285.921875%22%20y%3D%22218.3%22%3EFirst%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E',
     altText: 'Slide 1',
     caption: 'Slide 1',
-    header: 'Slide 1 Header'
+    header: 'Slide 1 Header',
+    key: '1'
   },
   {
     src: 'data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15ba800aa20%20text%20%7B%20fill%3A%23444%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15ba800aa20%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23666%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22247.3203125%22%20y%3D%22218.3%22%3ESecond%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E',
     altText: 'Slide 2',
     caption: 'Slide 2',
-    header: 'Slide 2 Header'
+    header: 'Slide 2 Header',
+    key: '2'
   },
   {
     src: 'data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15ba800aa21%20text%20%7B%20fill%3A%23333%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15ba800aa21%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23555%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22277%22%20y%3D%22218.3%22%3EThird%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E',
     altText: 'Slide 3',
     caption: 'Slide 3',
-    header: 'Slide 3 Header'
+    header: 'Slide 3 Header',
+    key: '3'
   }
 ];
 
diff --git a/src/UncontrolledCarousel.js b/src/UncontrolledCarousel.js
index 8fcd8ba87..a2efcf3e5 100644
--- a/src/UncontrolledCarousel.js
+++ b/src/UncontrolledCarousel.js
@@ -60,11 +60,12 @@ class UncontrolledCarousel extends Component {
     const { activeIndex } = this.state;
 
     const slides = items.map((item) => {
+      const key = item.key || item.src;
       return (
         <CarouselItem
           onExiting={this.onExiting}
           onExited={this.onExited}
-          key={item.src}
+          key={key}
         >
           <img className="d-block w-100" src={item.src} alt={item.altText} />
           <CarouselCaption captionText={item.caption} captionHeader={item.header || item.caption} />
diff --git a/src/__tests__/UncontrolledCarousel.spec.js b/src/__tests__/UncontrolledCarousel.spec.js
index acdcb70e1..2ebd14e03 100644
--- a/src/__tests__/UncontrolledCarousel.spec.js
+++ b/src/__tests__/UncontrolledCarousel.spec.js
@@ -3,9 +3,9 @@ import { shallow } from 'enzyme';
 import { Carousel, UncontrolledCarousel } from '../';
 
 const items = [
-  { src: '', altText: 'a', caption: 'caption 1' },
-  { src: '', altText: 'b', caption: 'caption 2' },
-  { src: '', altText: 'c', caption: 'caption 3' }
+  { src: '', altText: 'a', caption: 'caption 1', key: '1' },
+  { src: '', altText: 'b', caption: 'caption 2', key: '2' },
+  { src: '', altText: 'c', caption: 'caption 3', key: '3' }
 ];
 
 describe('UncontrolledCarousel', () => {
@@ -134,4 +134,14 @@ describe('UncontrolledCarousel', () => {
     instance.onExited();
     expect(instance.animating).toBe(false);
   });
+
+  it('should render carousel items with provided key', () => {
+    const carousel = shallow(<UncontrolledCarousel items={items} indicators={false} />);
+    const carouselItem1 = carousel.childAt(0);
+    const carouselItem2 = carousel.childAt(1);
+    const carouselItem3 = carousel.childAt(2);
+    expect(carouselItem1.key()).toBe('1');
+    expect(carouselItem2.key()).toBe('2');
+    expect(carouselItem3.key()).toBe('3');
+  });
 });