css-device-frames/src/application/_defaults.css

A collection of single-element, CSS-only application and device frames with support for multiple themes, customization via CSS custom properties, grid-based layouts, iframe elements, and scrolling content.

.app-frame {
    /* Defaults */
    --background       : #fff;
    --bar-background   : #f4f4f4 linear-gradient(to bottom, #fafafa, #f4f4f4);
    --bar-height       : 44px;
    --border-color     : #e3e3e3;
    --border-radius    : 8px;
    --border-width     : 1px;
    --box-shadow       : rgba(0, 0, 0, 0.08) 0px 10px 15px -3px, rgba(0, 0, 0, 0.03) 0px 4px 6px -2px;
    --button-color     : initial;
    --color            : initial;
    --grid-columns     : auto;
    --grid-rows        : auto;
    --padding-h        : 20px;
    --padding-v        : 20px;
    --title            : initial;
    --title-color      : #222;
    --title-size       : 0.875em;
    --title-weight     : 600;
    --url              : initial;
    --url-background   : #fff;
    --url-border-radius: calc(var(--border-radius) * 0.6);
    --url-border-width : 1px;
    --url-color        : #999;
}