Accordion Slider

In web page layout, header is the upper (top) part of the web page. It is definitely a strategic part of the page as the area which people see before scrolling the page in the first seconds of introduction to the website. Being somehow a sign of invitation, header should provide the core information about the digital product so that users could scan it in split seconds.
1. Design Guideline
1.1 Base

The Universal Navigation consist of core information such as:

1. About

2. Programmes

3. Services

4. Events

5. News

6. Publications

7. Community

8. Central Login/Signup (Dropdown option)

9. Universal Search

Mentorship

Get a step closer towards attaining your entrepreneurial dream by connecting with skilful and seasoned entrepreneurs from various backgroundsGet Started
Get Started

MaGIC IDEA Accelerator

IDEA Accelerator is a six-week programme that provides early-stage Impact Driven Enterprises (IDEs) with an opportunity to pilot their idea, test business plans, solidify their impact delivery models and secure capital through fundraising using innovative entrepreneurship strategiesLearn More
Learn More

National Regulatory
Sandbox

A platform that promotes innovation by providing a safe test bed to experiment and pilot solutions that either requires regulatory framework or potentially impacts a regulatory environment.Learn More
Get Started
MaGIC supports the creativity and innovation development in Malaysia through dynamic programs and capacity-building initiatives.
2. Implementation Notes

No content has been added for this component.

3. Reference

No content has been added for this component.

MaGIC Design Guideline
Governance & MaintenanceGuidelines Templates
Components (MOLECULE)
AccordionActivity TimelineAlertBreadcrumbsButtonsCards & BlocksFooterGlobal NavigationModalPanelSearchbox
Utilities (ORGANISM)
AllignmentBorderBoxDescription ListFloatsGridHorizontal ListHypernationInteractionsLayoutMarginMedia ObjectName Value ListPaddingPositionScrollableSizingTextThemesVertical ListVisibility
Guidelines (TEMPLATE)
AnimationColorData EntryDisplaying DataLayoutLoadingLocalizationMarkup and StyleMessagingNavigationTypographyVoice and Tone
Design Token (ATOM)
OverviewBackground ColorText ColorBorder ColorFontFont SizeOpacityLine HeightSpacingRadiusSizingShadowTimeMedia QueryZ-index
Accessibility
OverviewPattern
MaGIC Design Guideline
Governance & MaintenanceGuidelines Templates
ATOM
OverviewBackground ColorText ColorBorder ColorFontFont SizeOpacityLine HeightSpacingRadiusSizingShadowZ-index
MOLECULE
AccordionActivity TimelineAlertBreadcrumbsButtonsCards & BlocksHighlight BoxModalPanelSearchboxTagsImage BlockBlock QuoteField InputsTableUnordered ListOrdered ListSocial
ORGANISM
Dropdown NavigationHeaderGlobal NavigationTab SectionAccordion SliderFooterForm
TEMPLATE
Accessibility
OverviewPattern
MaGIC is an initiative by Ministry of Finance of Malaysia