Skip to content
@stylescape

Stylescape

Design Framework

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 Nov 13, 2024
  • font.gl Public

    Variable Font Collection

    stylescape/font.gl’s past year of commit activity
    JavaScript 0 MIT 0 0 0 Updated Nov 11, 2024
  • example-react Public

    Stylescape Example | React

    stylescape/example-react’s past year of commit activity
    TypeScript 0 MIT 0 0 1 Updated Nov 11, 2024
  • page.gl Public

    Layout Template Library

    stylescape/page.gl’s past year of commit activity
    Jinja 0 MIT 1 0 0 Updated Nov 11, 2024
  • example-vue Public

    Stylescape Example | Vue

    stylescape/example-vue’s past year of commit activity
    Vue 0 MIT 0 0 0 Updated Nov 11, 2024
  • icon.gl Public

    Modular Icon Framework

    stylescape/icon.gl’s past year of commit activity
    TypeScript 2 MIT 1 0 0 Updated Nov 11, 2024
  • example-svelte Public

    Stylescape Example | Svelte

    stylescape/example-svelte’s past year of commit activity
    SCSS 0 MIT 0 0 2 Updated Nov 11, 2024
  • move.gl Public

    User eXperience Toolkit

    stylescape/move.gl’s past year of commit activity
    SCSS 0 MIT 0 0 1 Updated Nov 11, 2024
  • unit.gl Public

    Dynamic Layout Engine

    stylescape/unit.gl’s past year of commit activity
    SCSS 0 MIT 2 0 2 Updated Nov 11, 2024
  • pack.gl Public

    Package Pipeline Manager

    stylescape/pack.gl’s past year of commit activity
    TypeScript 0 MIT 3 0 2 Updated Nov 11, 2024

People

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

Top languages

Loading…

Most used topics

Loading…