This builder will allow you to generate a custom version of the Tabs component.
The component will show up in between the pink lines below. The pink lines will not show up in production -- they are only used to allow you to view margins and paddings.
In the case of specialized components (things that are meant to be invisible or have a fixed location), the component may not display in this area.
Color theme used. There is no orange theme because there would be a lot of bright colors on the screen.
(attribute)
Width -- constrained to the container (default), full width, or full width but text is constrained (auto), or text is constrained to the page width (page).
(attribute)
Whether or not to use the horizontal layout. Recommended to not use this unless there are a few tabs.
(text attribute)
The ID of the tab that is open on load. This defaults to the first item in the list.
Custom CSS Variables and Styles (advanced use only)
Color of the default text in the tabs
Flex or block for the tabs list (controls horizontal or vertical layout)
Background color of the tab area
Button text color of the tab buttons
Button text color of the tab buttons when focused
Button background color of the tab buttons when focused
Button text color of the selected tab button
Button background color of the selected tab button
Button text color of the selected tab button when focused
Button background color of the selected tab button when focused
Border of the buttons and tab area for vertical and horizontal. Use standard CSS border layout
Flex or block for the tabs button list (controls horizontal or vertical layout)
Width of the tabs button list in vertical layout. Defaults to 350px.
HTML listed here
This parent has a style of that is not figured into the source HTML. You can change this by opening the Custom CSS Variables and Styles and editing the parent style.
There's no academic experience quite like Grainger Engineering. Ranked the #6 college of engineering with 13 top 5 programs from US News and World Report, we have a reputation of being the best of the best. But a lot goes into those numbers. Engaging professors. State-of-the-art facilities. Groundbreaking student resources. Brilliant classmates. Supportive environment. Endless opportunities. Whether you're a first year undergraduate or working toward a PhD, our programs are designed to help you become the engineer you want to be.