Monochrome Blue
Subheading
Want to use this color scheme in your world using GalaxyAnvil? Add this code to the bottom of your custom CSS: Monochrome Blue color scheme for GalaxyAnvil
Also want the matching header image? Then download it here: Monochrome Blue Cover Image
H1 Header Small text
Regular paragraph. Bold font. Italic font. Underlined font. Strikethrough font. Small text. Superscript. Subscript. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu. Aliquam dolor urna, posuere in nibh ultricies, blandit rutrum libero.
H2 Header Small text
H3 Header Small text
H4 Header Small text
Text Link Text Text Text Text Text Text Tooltip Text
Horizontal Rule:
Header Cell | Header Cell | Header Cell |
---|---|---|
Cell | Cell | Cell |
Cell | Cell | Cell |
Cell | Cell | Cell |
Cell | Cell | Cell |
SpoilerQuote with dropcap.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu. Aliquam dolor urna, posuere in nibh ultricies, blandit rutrum libero.
Aloud box. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu. Aliquam dolor urna, posuere in nibh ultricies, blandit rutrum libero.
- Ordered List
- Ordered List
- Ordered List
- Ordered List
- Ordered List
- Unordered List
- Unordered List
- Unordered List
- Unordered List
- Unordered List
H3 Header
H3 Header
Example Secret
Lorum ipsum blahblah.
Grandmaster Extras
The following require the container or section bbcode, which are grandmaster or above only.
Alerts
[container:alert alert-default] [h4]TITLE[/h4] [p]Alert body here.[/p] [/container]
The above code will create bootstrap alert blocks similar to those below. Replace 'default' in the container class with whichever color scheme you desire for the alert.
NOTE: These currently don't work properly inside of row/col, quote, aloud, etc.
Default Uses 'default' color from theme
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Primary Uses 'primary' color from theme
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Secondary Uses 'accent' color from theme
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Info
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Success
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Warning
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Danger
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Blue
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Green
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Yellow
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Red
TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mi elementum, volutpat lacus non, faucibus arcu.
Breadcrumb
[container:breadcrumb] [li][url=#link-here]Category[/url][/li] [li][url=#link-here]Sub-Category[/url][/li] [li]@Parent Article(generic)[/li] [li][section:active]Current Article[/section][/li] [/container]
The above will create a horizontal bootstrap 'breadcrumb trail' type of element, which can be used to show a hierarchy of articles and subcategories similar to what's used on the Galaxies End world articles. Recommended to be placed at the top of your vignette, above everything else. You can have as many or as little entries as you like - Just remember that each entry needs its own li tags.
Panels
[container:panel panel-default] [container:panel-heading] [h2]Optional header[/h2] [/container] [p]Panel body[/p] [/container]
The above will create a bootstrap panel, just like the panel used in WorldAnvil's sidebar (Tip: The WA sidebar uses the 'accent' color, which is the 'panel-default' class). The heading section is optional. Panels are used in Galaxies End to create the 'Table of Contents' block above the sidebar. Unlike alerts, these work well with large bodies of text, and can be used in columns.
Default Panel Uses 'accent' color from theme
Panel body.
Primary Panel Uses 'primary' color from theme
Panel body.
Secondary Panel Uses 'default' color from theme
Panel body.
Info Panel Uses 'info' color from theme
Panel body.
Success Panel Uses 'success' color from theme
Panel body.
Warning Panel Uses 'warning' color from theme
Panel body.
Danger Panel Uses 'danger' color from theme
Panel body.
[container:panel panel-primary] [container:panel-heading] [h2]Table of Contents[/h2] [/container] [ol] [li][url=#]Section[/url][/li] [li][url=#]Section[/url][/li] [li][url=#]Section[/url] [ol] [li][url=#]Sub-Section[/url][/li] [li][url=#]Sub-Section[/url][/li] [li][url=#]Sub-Section[/url][/li] [/ol] [/li] [/ol] [/container]
Table of Contents
Row Border Groups
Donut Pie Chart
[container:donut-chart] [container:donut donut-example] [section:donut-text][section:fas fa-users fa-2x] [/section][/section] [/container] [container:donut-values] [p][color:#cf4444][section:fas fa-square] [/section][/color] - 15% A[/p] [p][color:#ff791a][section:fas fa-square] [/section][/color] - 35% B[/p] [p][color:#ffe561][section:fas fa-square] [/section][/color] - 20% C[/p] [p][color:#26997c][section:fas fa-square] [/section][/color] - 20% D[/p] [p][color:#485673][section:fas fa-square] [/section][/color] - 10% Other[/p] [/container] [/container]
.user-css-presentation .donut-example { background: radial-gradient(var(--primary3Muted) 40%, transparent 41%), conic-gradient( #cf4444 0% 15%, #ff791a 15% 50%, #ffe561 50% 70%, #26997c 70% 90%, #485673 90% 100% }
- 15% A
- 35% B
- 20% C
- 20% D
- 10% Other
Of all the color combos I've seen you do. This one is my fave so far!