Coder Social home page Coder Social logo

bondz / lighter Goto Github PK

View Code? Open in Web Editor NEW

This project forked from code-hike/lighter

0.0 0.0 0.0 5.14 MB

The syntax highlighter used by Code Hike.

Home Page: https://lighter-codehike.vercel.app

JavaScript 57.84% TypeScript 41.45% CSS 0.71%

lighter's Introduction

The syntax highlighter used by Code Hike.

Usage

import { highlight } from "@code-hike/lighter";

const { lines, style } = await highlight(
  /* code  */ "print('hello')",
  /* lang  */ "py",
  /* theme */ "github-dark"
);

// base foreground and background
const { color, background } = style;

console.log(lines);

Output:

[
  [
    { "style": { "color": "#79C0FF" }, "content": "print" },
    { "style": { "color": "#C9D1D9" }, "content": "(" },
    { "style": { "color": "#A5D6FF" }, "content": "'hello'" },
    { "style": { "color": "#C9D1D9" }, "content": ")" }
  ]
]

For dark/light theme support with CSS see #25

For more theme colors (like line number foreground, selection background, etc.):

import { getThemeColors } from "@code-hike/lighter";

const themeColors = await getThemeColors("material-darker");

Credits

  • Using vscode-oniguruma for highlighting
  • Heavily inspired by Shiki and adapted to Code Hike needs.
  • Some more inspiration from starry-night
  • Grammars and some themes come from Shiki, which pulls them from different sources.

lighter's People

Contributors

pomber avatar github-actions[bot] avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.