drupal/uikit CSS Starters

theme.base.css

/* Use this file to set CSS variables & root properties */

/* Import google font */
@import url('');

/* Set root variables */
:root {
  /* Body paragraph text (used for rem sizing) */
  font-size: 18px;

  /* Default UK breakpoints */
  --uk-breakpoint-s: 640px;
  --uk-breakpoint-m: 960px;
  --uk-breakpoint-l: 1200px;
  --uk-breakpoint-xl: 1600px;
}

html {
  font-family: ;
  font-size: 1rem;
  font-weight: 400;
}

theme.component.css

/* Use this file to override/extend UIKit Component Systems */

/*
 * TYPOGRAPHY
 */
  .uk-light { }

  .uk-text-primary { }
  .uk-text-secondary { }
  .uk-text-white { }

  .uk-text-light { }
  .uk-text-regular { }
  .uk-text-semi-bold { }
  .uk-text-bold { font-weight: bolder; }
  .uk-text-xbold { }
  .uk-text-underline {text-decoration: underline;}
  .uk-text-italic {font-style: italic;}

  .uk-text-large { }
  .uk-text-small { }
  .uk-text-meta { }

  .uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, h1, h2, h3, h4, h5, h6 {color: inherit; margin: 0;}
  .uk-h1, h1 { }
  .uk-h2, h2 { }
  .uk-h3, h3 { }
  .uk-h4, h4 { }
  .uk-h5, h5 { }

/*
 * MARGINS, PADDING & SPACING
 */
  .uk-padding-xsmall { }
  .uk-padding-small { }
  .uk-padding { }
  .uk-padding-large { }
  .uk-padding-xlarge { }

/*
 * BACKGROUNDS
 */
  .uk-background-default { }
  .uk-background-primary { }
  .uk-background-secondary { }
  .uk-background-muted { }


/*
 * BUTTONS
 */
  .uk-button { }

  .uk-button-primary { }
  .uk-button-primary:hover,
  .uk-button-primary:active,
  .uk-button-primary:focus { }

  .uk-button-secondary { }
  .uk-button-secondary:hover,
  .uk-button-secondary:active,
  .uk-button-secondary:focus { }

  .uk-button-white { }
  .uk-button-white:hover,
  .uk-button-white:active,
  .uk-button-white:focus { }

  .uk-button-large { }


/*
 * BORDERS
 */
  .uk-border {border: 1px solid}

  .uk-border-primary { }
  .uk-border-secondary { }
  .uk-border-muted { }

  .uk-border-thick {border-width: thick;}

theme.layout.css

/* Use this file to customize UIKit implementation of page blocks/elements */

/*
 * LINKS & NAVIGATION
 */
  .uk-link, a { }
  .uk-link:hover, a:hover { }

theme.responsive.css

/* Use this file to create any custom media queries */

@media only screen and (min-width: var(--uk-breakpoint-s)) {

}

@media only screen and (min-width: var(--uk-breakpoint-m)) {

}

@media only screen and (min-width: var(--uk-breakpoint-l)) {

}

@media only screen and (min-width: var(--uk-breakpoint-xl)) {

}

@media only print {
  
}

theme.theme.css

/* Use this file to create new theme components */