diff --git a/src/accordion/accordion.spec.ts b/src/accordion/accordion.spec.ts
index 0d6dc5c37c..a4fef1a0e5 100644
--- a/src/accordion/accordion.spec.ts
+++ b/src/accordion/accordion.spec.ts
@@ -493,6 +493,21 @@ describe('ngb-accordion', () => {
expect(headingLinks[0].disabled).toBeTruthy();
});
+ it('should have the custom class', () => {
+ const testHtml = `
+
+
+
+ `;
+ const fixture = createTestComponent(testHtml);
+ const cards = Array.from(fixture.nativeElement.querySelectorAll('.card'));
+
+ fixture.detectChanges();
+ expect(cards[0]).toHaveCssClass('custom-classone');
+ expect(cards[1]).toHaveCssClass('custom-classtwo');
+ expect(cards[2]).toHaveCssClass('custom-classthree');
+ });
+
it('should remove collapsed panels content from DOM', () => {
const fixture = TestBed.createComponent(TestComponent);
fixture.detectChanges();
diff --git a/src/accordion/accordion.ts b/src/accordion/accordion.ts
index cb8aa4b4bf..3eb312c789 100644
--- a/src/accordion/accordion.ts
+++ b/src/accordion/accordion.ts
@@ -97,6 +97,11 @@ export class NgbPanel implements AfterContentChecked {
*/
@Input() type: string;
+ /**
+ * An optional class applied to the card that wraps the panel.
+ */
+ @Input() cardClass: string;
+
titleTpl: NgbPanelTitle | null;
headerTpl: NgbPanelHeader | null;
contentTpl: NgbPanelContent | null;
@@ -156,7 +161,7 @@ export interface NgbPanelChangeEvent {
-