Skip to content
@stylescape

Stylescape

Design Framework
README.md

Stylescape Logo

Stylescape

Design Framework

Stylescape is a modular, scalable, and customizable design framework dedicated to streamlining style and layout design for both web and print media. Written in SCSS and TypeScript, it aimes to bridge the gap between visual design and code. Whether you’re a designer or developer, Stylescape provides a robust toolkit that empowers you to create harmonious, scalable, and accessible designs efficiently.

website: scape.style
repository: stylescape

Graphic Languages

Stylescape is built on the following modules:

  • unit.gl is a Dynamic Layout Engine focused on fluid typography and responsive design.
  • hue.gl is a Perceptual Color System and color management toolkit.
  • icon.gl is a Modular Icon Library with various integration options.
  • font.gl is a Variable Font Collection curated as an all-round base for typography.
  • move.gl is a User eXperience Toolkit created for interactives and immersives.
  • page.gl is a Page Layout Library created for rapid prototyping.
  • pack.gl is a Package Pipeline Manager that streamlines streamlines bundling assets and code for deployment.

Resources

  • Brand - Brand guidelines and assets.
  • Community - Engage with the Stylescape community.
  • devContainer - Development container setup for Stylescape.
  • Theme Template - Theme template for Stylescape projects.

Examples

  • npm - Stylescape Sass and JS with npm.
  • Parcel - Stylescape Sass and JS with Parcel.
  • React - Stylescape Sass and JS with React and Next.js.
  • Svelte - Stylescape Sass and JS with Svelte.
  • Vite - Stylescape Sass and JS with Vite.
  • Vue - Stylescape Sass and JS with Vue + Vite.
  • Webpack - Bundle Stylescape Sass and JS with Webpack.

Made with ❤️ by Scape Agency

Pinned Loading

  1. stylescape stylescape Public

    Stylescape Design Framework

    SCSS 7

  2. hue.gl hue.gl Public

    Perceptual Color System

    SCSS 1

  3. unit.gl unit.gl Public

    Dynamic Layout Engine

    SCSS 2

  4. icon.gl icon.gl Public

    Modular Icon Framework

    TypeScript 2 1

  5. font.gl font.gl Public

    Variable Font Collection

    JavaScript

  6. page.gl page.gl Public

    Layout Template Library

    Jinja 1

Repositories

Showing 10 of 20 repositories
  • stylescape Public

    Stylescape Design Framework

    stylescape/stylescape’s past year of commit activity
    SCSS 0 MIT 7 1 1 Updated Dec 13, 2024
  • example-vue Public

    Stylescape Example | Vue

    stylescape/example-vue’s past year of commit activity
    Vue 0 MIT 0 0 1 Updated Dec 9, 2024
  • pack.gl Public

    Package Pipeline Manager

    stylescape/pack.gl’s past year of commit activity
    TypeScript 0 MIT 3 0 5 Updated Dec 9, 2024
  • community Public

    Stylescape | Community Resources

    stylescape/community’s past year of commit activity
    Dockerfile 0 CC-BY-SA-4.0 0 0 1 Updated Dec 9, 2024
  • example-npm Public

    Stylescape Example | NPM

    stylescape/example-npm’s past year of commit activity
    HTML 0 MIT 0 0 0 Updated Dec 9, 2024
  • font.gl Public

    Variable Font Collection

    stylescape/font.gl’s past year of commit activity
    JavaScript 0 MIT 0 0 0 Updated Dec 9, 2024
  • move.gl Public

    User eXperience Toolkit

    stylescape/move.gl’s past year of commit activity
    SCSS 0 MIT 0 0 0 Updated Dec 9, 2024
  • hue.gl Public

    Perceptual Color System

    stylescape/hue.gl’s past year of commit activity
    SCSS 0 MIT 1 0 5 Updated Dec 9, 2024
  • page.gl Public

    Layout Template Library

    stylescape/page.gl’s past year of commit activity
    Jinja 0 MIT 1 0 0 Updated Dec 9, 2024
  • example-react Public

    Stylescape Example | React

    stylescape/example-react’s past year of commit activity
    TypeScript 0 MIT 0 0 1 Updated Dec 9, 2024
View all repositories

People

This organization has no public members. You must be a member to see who’s a part of this organization.

Developer Program Member