Table of Contents

BLUEPHRASE Style

BLUEPHRASE uses CSS — Cascading Style Sheets — for all its typographic rendering and page layout.

  • animation
  • appearance
  • background
  • character
  • column
  • flexbox
  • framing
  • generate
  • glyph
  • grid
  • interface
  • levant
  • list
  • paging
  • paragraph
  • position
  • sizing
  • table
  • target
  • transition
  • transform
  • typography
  • whitespace

animation

Keyframe animations

Properties to gradually change the look of things, or to continuously loop over different states of an element.
animation, animation-delay, animation-direction, animation-duration, animation-fill-mode, animation-iteration-count, animation-name, animation-play-state, animation-timing-function, @keyframes, css, style, animation, animation

appearance

Can you see me now?

Properties to control the layout and visibility of elements.
appearance, display, filter, opacity, visibility, css, style, appearance, appearance

background

Background images and colors

Control the placement and behavior of background images, colors, and gradients.
background, background-attachment, background-blend-mode, background-clip, background-color, background-image, background-origin, background-position, background-repeat, background-size, css, style, background, background

character

Typographic treatment

These properties set the typographic treatment used with individual characters.
letter-spacing, quotes, tab-size, text-decoration, text-decoration-line, text-decoration-color, text-decoration-style, text-decoration-thickness, text-emphasis, text-emphasis-style, text-emphasis-color, text-emphasis-position, text-shadow, text-transform, text-underline-position, white-space, word-break, word-spacing, word-wrap, css, style, character, character

column

Multi-column layout

These properties define a layout scheme that uses two or more columns.
columns, column-count, column-fill, column-gap, column-span, column-width, css, style, column, column

flexbox

Smart resizing container

Define a container that has elements which adjust their size according to the amount of space available.
align-content, align-items, align-self, flex-basis, flex-direction, flex-flow, flex-grow, flex, flex-shrink, flex-wrap, justify-content, css, style, flexbox, flexbox

framing

Borders, outlines, shadows

These properties set the style, color, thickness, shadows, corner radius and more, for borders and outlines.
border, border-style, border-color, border-width, border-top, border-right, border-bottom, border-left, border-radius, border-image, border-image-source, border-image-slice, border-image-width, border-image-outset, border-image-repeat, box-decoration-break, box-shadow, outline, outline-style, outline-color, outline-offset, outline-width, css, style, framing, framing

generate

Prepending & appending

Properties to generate content before and after an element.
content, counter-reset, counter-increment, css, style, generate, generate

glyph

Special font glyph variants

Properties to choose which special font glyph variants to use.
font-variant, font-variant-caps, font-variant-gatures, font-variant-numeric, font-variant-position, font-variant-east-asian, font-language-override, font-variant-alternates, css, style, glyph, glyph

grid

Define a grid system

Use templates to define a fixed layout of rows and columns, or auto-rules to define grids with auto-expanding rows or columns.
grid, grid-area, grid-template, grid-template-rows, grid-template-columns, grid-template-areas, grid-row, grid-row-start, grid-row-end, grid-column, grid-column-start, grid-column-end, grid-gap, grid-row-gap, grid-column-gap, grid-auto-columns, grid-auto-rows, grid-auto-flow, css, style, grid, grid

interface

Carets & cursors

Adust the user interface for the mouse pointer, the text caret and user selectability.
caret-color, cursor, user-select, css, style, interface, interface

levant

Override Unicode bidi

Override the Unicode bidirectional text specification.
direction, unicode-bidi, css, style, levant, levant

list

Custom list appearance

Customize the appearance of ordered and unordered list items.
list-style, list-style-type, list-style-position, list-style-image, css, style, list, list

paging

Widows, orphans, and making a clean break

Rules for nicely breaking the flow of a document into printed pages.
break-after, break-before, break-inside, orphans, page-break-*, widows, css, style, paging, paging

paragraph

Paragraph layout

Specify paragraph leading, alignment and indentation rules.
hanging-punctuation, line-height, text-align-last, text-align, text-indent, text-overflow, css, style, paragraph, paragraph

position

X, Y, Z and more

Adjust the position of an element with respect to the other elements in the document.
position, top, right, bottom, left, clip, z-index, float, clear, overflow, overflow-x, overflow-y, overflow-block, overflow-inline, caption-side, css, style, position, position

sizing

Width and height

Specify the initial values for width and height, and the minimum and maximum values for expandable elements.
width, min-width, max-width, height, min-height, max-height, resize, css, style, sizing, sizing

table

Styling for tables

Specify how to handle the alignment and space between table cells.
border-collapse, border-spacing, empty-cells, table-layout, vertical-align, css, style, table, table

target

Targeting the whole document

Special rules that apply to the entire document.
all, @media, css, style, target, target

transition

Hover transitions

Properties to smoothly transition to a new state when the mouse hovers over an element.
transition, transition-delay, transition-duration, transition-property, transition-timing-function, css, style, transition, transition

transform

Rotation, scale, translate, skew

Apply a mathematical transform operation on an element to shift its position, scale it, rotate it, or skew its shape.
transform, transform-origin, transform-style, transform-box, rotate, scale, translate, perspective, perspective-origin, backface-visibility, css, style, transform, transform

typography

Everything to do with fonts

Declarations that specify font characteristics.
font, font-family, font-size, font-style, font-weight, font-stretch, color, @font-face, font-size-adjust, font-kerning, font-synthesis, font-optical-sizing, css, style, typography, typography

whitespace

White space around the element

Specify how much white space surrounds the element's content and outer border.
margin, margin-top, margin-right, margin-bottom, margin-left, padding, padding-top, padding-right, padding-bottom, padding-left, box-sizing, css, style, whitespace, whitespace
☰ ℹ ⃠ 0

style — Table of Contents

🔗 🔎 ★ ✚