Global Presets UI Style Guide
This global presets style guide forms the foundation of FestivalsKelowna.com and the website styling.
While the key purpose of this page is to provide inspiration and styling guidelines for the website and brand, the elements also serve an additional function. Modules on this page are replicated throughout the website for brand consistency. Changing the styling of a preset will automatically update all instances of that element across the website.
01. Color palette
This is the colour palette used throughout the website. Colours used in the top row are the primary palette while the bottom row is the secondary palette and should be used sparingly.
#ffffff
#1e1e1e
#565a5c
#fdc82f
#FF760E
#02afd7
#d7f070
#99ca3d
#ea098d
#ec3527
#e17a00
#fdc82f
#fdc82f
rgba(253,200,47,0.3)
02. Visuals
Graphical elements and images are an important part of the FestivalsKelowna.com brand experience. The following elements form an overview of the visual look of the website.
03. Text styles
A singular font has been selected for use throughout the website. The font is called Lexend and it is utilized in varying weights and sizes for increased readability and variation.
Heading 1
Heading 1
Heading 2
Heading 2
Heading 3
Heading 3
Heading 4
Heading 4
Body
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Link
List
- Lorem ipsum dolor sit amet
- Ut enim ad minim veniam
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Quote body 1
Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Proin eget tortor risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
All in one
Heading 1
Heading 2
Heading 3
Heading 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
- Lorem ipsum dolor sit amet
- Ut enim ad minim veniam
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Ordered list
- Item 1
- Item 2
- Item Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Proin eget tortor risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
04. Buttons
Buttons are an important part of the website and help us communicate clearly.Â
Button 1
Button 2
Button 3
Button 4
Button 5
Button 6
05. Blurbs
Blurb modules are a handy way to format bite-sized content, particularly when icons or images are required.
Blurb 1
Are you an artist?
We welcome artists from all art disciplines. Through a juried selection process, we seek to ensure a diverse reflection of the artistic excellence within our community. Acceptance into Arts on the Avenue is based on quality, originality and craftsmanship.
For more detailed information on applying refer to the application pdf (stay tuned for 2021 info).
Blurb 2
Lorem ipsum dolor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eleifend nulla orci, at bibendum nisl semper eu. Mauris ultrices efficitur mi quis auctor. Nulla facilisi. Maecenas eleifend, nunc in fringilla dapibus, orci velit dictum leo, nec tempus nisl turpis ac.
Blurb 3
How can I apply to perform at an upcoming event?
Blurb 4
Renata Mills
Executive Director
06. Other modules
Additional module designs provide inspiration for website design and brand consistency.
Image 1
Image 2
Image 3
Image 4
Image 5
Image 6
Post Slider 1
Contact form 1
Toggle 1
How can artists participate?
- To be considered for the event, please complete the Application.Â
- There are a limited number of spaces available, so it is greatly encouraged to apply by the deadline.
- Additional applications will be considered if spots are still available after the first selection round.Â
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Nulla quis lorem ut libero malesuada feugiat. Nulla porttitor accumsan tincidunt. Donec rutrum congue leo eget malesuada. Vivamus suscipit tortor eget felis porttitor volutpat.Â
Nulla quis lorem ut libero malesuada feugiat
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Nulla quis lorem ut libero malesuada feugiat. Nulla porttitor accumsan tincidunt. Donec rutrum congue leo eget malesuada. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Donec rutrum congue leo eget malesuada. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a.
Nulla porttitor accumsan tincidunt donec rutrum congue
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Nulla quis lorem ut libero malesuada feugiat. Nulla porttitor accumsan tincidunt. Donec rutrum congue leo eget malesuada. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Donec rutrum congue leo eget malesuada. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a.
Accordion 2
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Nulla quis lorem ut libero malesuada feugiat. Nulla porttitor accumsan tincidunt. Donec rutrum congue leo eget malesuada. Vivamus suscipit tortor eget felis porttitor volutpat.Â
Nulla quis lorem ut libero malesuada feugiat
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Nulla quis lorem ut libero malesuada feugiat. Nulla porttitor accumsan tincidunt. Donec rutrum congue leo eget malesuada. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Donec rutrum congue leo eget malesuada. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a.
Nulla porttitor accumsan tincidunt donec rutrum congue
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Nulla quis lorem ut libero malesuada feugiat. Nulla porttitor accumsan tincidunt. Donec rutrum congue leo eget malesuada. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Donec rutrum congue leo eget malesuada. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a.
Social media follow 1
Social media follow 2
Are you a musician or artist?
If you are interested in being considered for our events, please fill out the online application on our “Perform With Us” page!
Testimonial 1
“Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Mauris bl”
Slider 1
Divider 1
Video 1
Canada Day performance line-up announced
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In semper varius orci sit amet venenatis. Etiam cursus velit est, non blandit nisi pharetra nec. Praesent dictum, ante eu eleifend tristique,...
Festivals Kelowna announces new Pink Glitter Parade
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In semper varius orci sit amet venenatis. Etiam cursus velit est, non blandit nisi pharetra nec. Praesent dictum, ante eu eleifend tristique,...
Hey! I’m a cool news title that’s super interesting
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In semper varius orci sit amet venenatis. Etiam cursus velit est, non blandit nisi pharetra nec. Praesent dictum, ante eu eleifend tristique,...