The C code highlighting engine for the web.
Try Aurora Online ❤️🔥
You can try Aurora online here before using it in your project.
Don't worry about rerendering your react app. Aurora will take care of it.
npm install aurora-code aurora-reactimport { Aurora } from 'aurora-react'; // Aurora code Component import 'aurora-code/themes/oneDarkPro.css'; // Aurora theme (css) ... // code is the C code string <Aurora code={code} />/* Custom theme */ .aurora-string { color: pink; } .aurora-keyword { color: lime; }include the css file. And configuration is done ✨.
import { Aurora } from 'aurora-react'; // Aurora code Component ... // code is the C code string <Aurora code={code} /><Aurora code={code} config={{ mode: 'inline', styles: { comment: 'gray', keyword: 'lime', name: 'blue', function: 'limegreen', string: 'pink', }, }} />Here is an example of theme object for configuring the theme.
// One Dark Pro theme one_dark_pro = { comment: '#5c6370', comment_start: '#5c6370', comment_end: '#5c6370', preprocessor: '#c678dd', defined: '#d19a66', header_file: '#98c379', keyword: '#c678dd', name: '#ef596f', string: '#98c379', 'quote single': '#98c379', 'quote double': '#98c379', 'quote angle': '#98c379', format_specifier: '#d19a66', number: '#d19a66', bin_prefix: '#ef596f', hex_prefix: '#ef596f', oct_prefix: '#ef596f', function: '#61afef', operator: '#c678dd', escape: '#56b6c2', 'open_paren bracket0': '#d19a66', 'open_curly bracket0': '#d19a66', 'close_paren bracket0': '#d19a66', 'close_curly bracket0': '#d19a66', 'open_paren bracket1': '#c678dd', 'open_curly bracket1': '#c678dd', 'close_paren bracket1': '#c678dd', 'close_curly bracket1': '#c678dd', 'open_paren bracket2': '#56b6c2', 'close_curly bracket2': '#56b6c2', 'close_paren bracket2': '#56b6c2', 'open_curly bracket2': '#56b6c2', 'open_square bracket0': '#c678dd', 'close_square bracket0': '#c678dd', 'open_square bracket1': '#d19a66', 'close_square bracket1': '#d19a66', 'open_square bracket2': '#56b6c2', 'close_square bracket2': '#56b6c2', };Here is an example of theme css.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.