Table of Contents


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


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


Can you see me now?

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


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


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


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


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


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


Prepending & appending

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


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


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


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


Override Unicode bidi

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


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


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 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


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


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


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


Targeting the whole document

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


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


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


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


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

style Table of Contents

🔗 🔎