Styleguide
Brand Colors
slate - #636262
deep-sea - #294F4B
sea-foam - #538E88
sage - #294F4B
thyme - #9CC6C1
suede - #D8E8E7
Typography
Headings
H1
H2
H3
H4
H5
H6
Display headings
Display 1
Display 2
Display 3
Display 4
Paragraphs
Display 1
Display 2
Display 3
Display 4
Paragraphs
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.
Suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.
Type styles
- Strong
- Emphasis
- Inline link
- Strike
- Sup
Blockquotes
Eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.
The author of the quote
Buttons
Background Colors
Theme Colors
bg-primary
bg-secondary
bg-success
bg-info
bg-warning
bg-danger
bg-light
bg-dark
bg-blue-643
Text & Link Colors
Theme Colors
Brand Colors
Testimonials
Testimonial 1: Dr. Adi J.
Testimonial 2: Francine M.
Testimonial 3: Jennifer S.
Testimonial 4: Jordan K.
Testimonial 5: Sophie J.
Testimonial 6:
Scientists
Scientist 1: Dr. Steve Henig, PhD
Scientist 2: Dr. Colleen Draper, MS,RD, PhD
Scientist 3: Dr. Lee Schmidt, PhD
Scientist 4: Diana Noland, RD, MPH, CCN
Ingredients
Ingredient 1: Vitamin D3
Plays a critical role in promoting immune response by enhancing the function of our immune cells.
It has both anti-inflammatory and immunoregulatory properties and is crucial for the activation of immune system defenses.
Low levels have been associated with an increased susceptibility to infection, disease, and immune-related disorders.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 2: Vitamin C
An essential micronutrient and potent antioxidant.
It supports epithelial barrier function against pathogens and promotes the oxidant scavenging activity of the skin, thereby potentially protecting against environmental oxidative stress.
Supplementation with vitamin C appears to be able to both prevent and treat respiratory infections.
We don't absorb 100 percent of the iron in food, especially non-heme iron from plant foods. Vitamin C (ascorbic acid) acts as a catalyst to help our bodies absorb iron better from food and from supplements. This is important because iron is an essential component of hemoglobin, the substance in red blood cells that delivers oxygen to every cell in your body. Without enough iron and oxygen, you're likely to feel tired, your immune system's ability to fight off infections will take a hit and your brain function may not be as sharp as it could or should be.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 3: Vitamin A
Best known as an anti-inflammation vitamin because of its critical role in enhancing immune function.
Influence the immune response in a highly specific way as its bioactive metabolites strengthen intestinal immune response.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 4: Vitamin B6
Is vital to supporting biochemical reactions in the immune system so that it responds appropriately. B6 helps your body make a protein called interleukin-2, which helps direct the actions of white blood cells.
They act like buddies, working synergistically to reduce levels of homocysteine, an amino acid, in the body. Lower homocysteine may reduce the risk of heart disease and stroke. The trio of B vitamins also helps maintain brain health and proper neurological function.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 5: Vitamin B12
Plays an important role in white blood cell production which are essential for proper immune system functioning.
They act like buddies, working synergistically to reduce levels of homocysteine, an amino acid, in the body. Lower homocysteine may reduce the risk of heart disease and stroke. The trio of B vitamins also helps maintain brain health and proper neurological function.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 6: Folate
Needed to make DNA and RNA, the genetic material that dictates cell functions. Deficiency of the vitamin could hamper immunity.
They act like buddies, working synergistically to reduce levels of homocysteine, an amino acid, in the body. Lower homocysteine may reduce the risk of heart disease and stroke. The trio of B vitamins also helps maintain brain health and proper neurological function.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 7: Zinc
Plays a central role in the immune system, and zinc-deficient persons experience increased susceptibility to a variety of pathogens. Zinc is crucial for normal development and function of immune cells.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 8: Selenium
Plays an important role in the health of our immune system. This potent antioxidant helps lower oxidative stress in your body, which reduces inflammation and enhances immunity. Studies have demonstrated that increased blood levels of selenium are associated with enhanced immune response.
Vitamin E and Selenium work in synergy to protect cells from free radical damage. Selenium exerts its anti-oxidant effect within the cell itself, while Vitamin E works in the cell membranes which enclose the cell. An excess of one of these nutrients will help to counteract a deficiency of the other.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 9: Copper
An essential trace mineral necessary for survival. It is found in all body tissues and plays a role in making red blood cells and maintaining nerve cells and the immune system.
Both enhance the retention of copper.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
https://nyaspubs.onlinelibrary.wiley.com/doi/abs/10.1111/j.1749-6632.1990.tb00142.x?sid=nlm%3Apubmed
Ingredient 10: Echinacea
Echinacea is an herb from the flowering plant Asteraceae. It contains a complex mix of active substances believed to be antimicrobial and have an effect on the human immune system.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 11: Quercetin
Is a plant flavonol with antioxidant properties. Well known for its activity in radical scavenging and anti-allergic properties characterized by stimulation of the immune system.
Vitamin E enhances quercetin penetration through the blood–brain barrier (BBB), which leads to significant improvement in quercetin concentration and thus reduces the prevalence of oxidative damage in the brain.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 12: Turmeric
Research has shown that there is a significant antioxidant effect of curcumin. Both Provide natural ways to help support the immune system by increasing the immunomodulating capacity of the body.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Ingredient 13: Elderberry
The berries of the elderberry shrub are filled with antioxidants and vitamins that support your immune system and help tame inflammation.
We use nutrients backed by a significant body of research that is growing every day. Of the thousands of unaffiliated studies our in-house scientists sorted through to guide our choices, the titles below are the most relevant.
Lists
|
|
Numeric bullet
|
|
Child lists (to match the RTE styles) |
|
Responsive tables
| Order | Date | Payment Status | Fulfillment Status | Total |
|---|---|---|---|---|
| #1001 | December 22, 2021 | Authorized | Unfulfilled | $43.03 |
| #1002 | December 23, 2021 | Authorized | Unfulfilled | $44.03 |
| #1003 | December 24, 2020 | Authorized | Unfulfilled | $45.03 |
| #1004 | December 25, 2020 | Authorized | Unfulfilled | $46.03 |
| #1005 | December 26, 2020 | Authorized | Unfulfilled | $47.03 |
| #1006 | December 27, 2020 | Authorized | Unfulfilled | $48.03 |
Forms
Default form elements
Invisible labels
Add a class of label-hidden to a label to visually hide it, while keeping it accessible to screen readers. Use the placeholder attribute as your visible label.
Note: The placeholder attribute only works in IE10+, so invisible labels are disabled in IE9 and below.
Vertical forms (customer, contact, etc)
No styles for this exist in Slate, but are used in most themes. Style elements inside a form/div with class `form-vertical` to see your styles here.
You cannot add a class directly to most liquid form elements (e.g. {% form 'contact' %}). Instead, wrap the form in a div with the class .form-vertical to achieve the same effect.
Notes and form errors
No note styles exist in Slate but are commonly added to handle form errors. Example styles:
.note {
padding: 20px;
border: 1px solid #ccc;
}
.note--success {
border-color: green;
background-color: lightgreen;
}
.note--error {
border-color: red;
background-color: lightred;
}
Example usage:
{% if form.posted_successfully? %}
<p class="note note--success">Thanks for submitting the form</p>
{% endif %}
{% if form.errors %}
<div class="note note--error">
{{ form.errors | default_errors }}
</div>
{% endif %}
This is an error message.
- Bullets can offer more insight to the error
Miscellaneous elements
Horizontal Rules
There are no default hr styles in Slate, but these are common ones to add.
Default hr
Invisible hr.hr--clear
Small hr.hr--small
SVG icons
Read more about using, creating, and editing SVG icons in Slate's documentation.